如何让 onPress 在 TextInput 内的 React Native Text 元素上触发？答案

【问题标题】：How can I get onPress to fire on a React Native Text element inside a TextInput?如何让 onPress 在 TextInput 内的 React Native Text 元素上触发？
【发布时间】：2021-04-30 00:53:29
【问题描述】：

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

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

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

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

【问题讨论】：

所以你的意思是当你点击文本元素时 coonsole.log 不打印 1？
@Sakshi 没错

标签： react-native

【解决方案1】：

您可以将其包装在 TouchableOpacity 中：

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

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

【讨论】：

感谢您的回答。对不起，我应该更清楚，但我希望每个 Text 元素的模态对于该特定元素都是唯一的。如果有办法引用被触摸的特定子元素，那么它就可以工作。