react-native - 尽管使用官方反应本机文档中的源代码，但 TouchableHighlight 不起作用

Question

我是一名新的 react 原生开发人员，我遇到了 TouchableHighlight 的问题，它总是显示错误“错误：React.Children.only 预计会收到单个 React 元素子项。” 此外，当我删除它时，它照常工作，我假设这个问题来自我的设备/vscode/浏览器。因为我已经遵循了https://reactnative.dev/docs/touchablehighlight的源代码，但仍然显示该错误。没有 TouchableHighlight 标记的
错误图像图像

这是我的代码

render() {
return (
  <View style={styles.container}>
    <TouchableHighlight onPress={this.onPress}>
      <View style={styles.button}>
        <Text>Touch Here</Text>
      </View>
      </TouchableHighlight>
    <View style={[styles.countContainer]}>
      <Text style={[styles.countText]}>
        {this.state.count ? this.state.count : null}
      </Text>
    </View>
  </View>
);}

Answer 1

从错误消息中，如果您将 Mutlipe 子组件传递给TouchableHighlight

从文档：

TouchableHighlight 必须有一个孩子（不为零或多个）。如果您希望拥有多个子组件，请将它们包装在 View 中

<TouchableHighlight onPress={onPress}>
  <View style={styles.button}> // Mutlipe child components are wrapped in a View
    <Text>Touch</Text> // component 1
    <Text>Here</Text> // component 2
  </View>
</TouchableHighlight>