如何在 React Native 的 render() 函数之外创建嵌套组件数组？答案

【问题标题】：How to create an array of nested components outside of the render() function in React Native?如何在 React Native 的 render() 函数之外创建嵌套组件数组？
【发布时间】：2020-06-09 15:55:01
【问题描述】：

我有一个作为类实现的屏幕，带有一个渲染方法。我正在尝试创建一个方法，该方法将返回一个 <View> 组件数组，其中两个 <Text> 组件作为子组件。

为了在此处进一步提炼问题，我只是想弄清楚如何返回嵌套有子元素的组件。即：

  makeNested() {
    return <View> <Text>test</Text> </View>
  }

  render() {
    return (
      {this.makeNested()}
    )
  }

这给了我一个错误，告诉我需要在 <Text> 组件内呈现文本，因此它似乎没有将内部组件解析为 JSX 对象。

可以这样做吗？

【问题讨论】：

尝试用片段包装你的 this.makeNested() 调用：<>{this.makeNested()}</>
@ehutchllew 哇，好用，谢谢！

标签： reactjs react-native jsx

【解决方案1】：

试试这个

export default class YourScreen extends Component {
 makeNested() {
    return <View> <Text>test</Text> </View>
  }

  render() {
    return (
      {this.makeNested}
    )
  }
}

【讨论】：

抱歉，在我的问题中忘记了this。 this.makeNested() 对我没有影响。这对你有用吗？
你试过在函数构造函数中绑定吗？ this.maskedNested = this.maskedNested.bind(this);