React Native，onPress没有触发

Question

当我将onPress={test}添加到Dice.js中的View标记时，无法从我在Boxes.js中编写的函数test()获得任何输出。 我试图在Text之类的标签上添加test() ，然后它可以工作，但是当我将它放在 View 标签上时却不行。

Boxes.js：

import react from "react";
import { StyleSheet, Text, View, Image } from "react-native";

import Dice from "./Dice";
import PatternDivider from "./PatternDivider";

export function test() {
  console.log("hi");
}

export default class Boxes extends react.Component {
  render() {
    return (
      <View style={styles.box}>
        <Text style={styles.header}>Advice #117</Text>
        <Text style={styles.advice}>
          It is easy to sit up and take notice, what's difficult is getting uu
          and taking action
        </Text>
        <PatternDivider />
        <Dice />
      </View>
    );
  }
}

骰子.js：

import react from "react";
import { StyleSheet, Text, View, Image } from "react-native";

import { test } from "./Boxes";

export default class Dice extends react.Component {
  render() {
    return (
      <View style={styles.circle} onPress={test}>
        <Image
          source={require("../assets/icon-dice.png")}
          style={styles.dice}
        />
      </View>
    );
  }
}

Answer 1

如果您希望Dice可点击，请使用处理按下事件的组件之一，例如Pressable 。 并非所有组件都接受onPress属性， View就是其中之一。

import react from "react";
import { StyleSheet, Text, View, Image, Pressable } from "react-native";

import { test } from "./Boxes";

export default class Dice extends react.Component {
  render() {
    return (
      <Pressable style={styles.circle} onPress={test}>
        <Image
          source={require("../assets/icon-dice.png")}
          style={styles.dice}
        />
      </Pressable>
    );
  }
}

Answer 2

React Native 的 View 组件没有onPress属性https://reactnative.dev/docs/view