javascript - 无法添加没有 YogaNode 的子级

Question

这是我的功能:

  getIndicators(){
    const {pages} = this.state
    var indicators = null
    for(var i = 0 ; i < pages.length ; ++i){
      if(pages[i].active)
        indicators += <View style={styles.activeCircle} />
      else
        indicators += <View style={styles.inActiveCircle} />  
    }

    return indicators;
  }

在我的 render 函数的 return 中:

 <View style={{width:'70%',height:'100%',justifyContent:'center',flexDirection:'row',alignSelf:'center',alignItems:'center',backgroundColor:'#fff'}}>
  {this.getIndicators()}
 </View>

但我收到此错误消息:

Cannot add a child that doesn't have a YogaNode to parent without a measure.

我必须使用这个功能。没有它，我必须编写硬代码。

Answer 1

问题是因为您将 View 连接在一起。需要将它们添加到数组中。此外，如果您循环遍历项目，则需要有一个唯一的键属性，我已将其添加到下面更新的 getIndicators 函数中。

如果您将 getIndicators 函数更新为以下内容，它应该可以工作

getIndicators = () => {
  const {pages} = this.state
  var indicators = []
  for(var i = 0 ; i < pages.length ; ++i){
    if(pages[i].active)
      indicators.push(<View key={i} style={styles.activeCircle} />)
    else
      indicators.push(<View key={i} style={styles.inActiveCircle} />)  
  }
  return indicators;
}