react-native - 如何让 onPress 触发 TextInput 内的 React Native Text 元素？

Question

出于样式的目的，我有多个 Text 元素作为 TextInput 的子元素。我希望用户点击它们以激活模式（该 Text 元素独有），但是我无法让 onPress 事件起作用。这是一个简化的示例：

<TextInput>
  <Text onPress={() => console.log(1)}>touch me</Text>
</TextInput>

正如您在 TextInput 中所期望的那样，“触摸我”是可编辑的，但 onPress 在被点击时不会触发。

有没有办法让这个设置按我的意愿工作？

标签： react-native

Answer 1

您可以将其包装在TouchableOpacity中：

const [value, setValue] = useState('Press me');

return <TouchableOpacity onPress={() => alert("Hello world")}>
  <TextInput
    value={value}
  />
</TouchableOpacity>