react-native – 如何将数据传递给SectionList？

发布时间：2020-12-15 16:20:59 所属栏目：百科来源：网络整理

导读：我真的很困惑,因为我不明白如何将数组传递给SectionList.当我尝试这一切时一切都很好 SectionList renderItem={({item}) = ViewText title={item.title}/Text/View} renderSectionHeader={({section}) = ViewText title={section.key}/Text/View} sections={

我真的很困惑,因为我不明白如何将数组传递给SectionList.当我尝试这一切时一切都很好

<SectionList
                        renderItem={({item}) => <View><Text> title={item.title}</Text></View>}
                        renderSectionHeader={({section}) => <View><Text> title={section.key}</Text></View>}
                        sections={[
                                {data: [{title:123},{title:"aaa"}],key: "aaa"},data: [{title:333},{title:"bbbb"}],key: "bbb"},{data: [{title:123},key: "ccc"},]}
                    />

但是,如果我尝试使用一个函数(据我所知,它完全相同),我得到一个错误“props.sections.reduce不是一个函数”.如何将带有函数的数组传递给SectionList？谢谢

sections={()=>[
                                    {data: [{title:123},]}
                        />

解决方法

段道具需要一个数组而不是一个函数.要在props中使用函数,此函数必须返回一个数组.该数组应包含一个字符串键和一个数据对象.您可以在此对象中使用许多参数,有关必须信息,请参阅 this page

例：

export default class Example extends React.Component {

  selectionList = () => {
    return([
      {data: [{title:123},{data: [{title:333},])
  }

  render () {
    return (
      <View>
        <SectionList
          renderItem={({item}) => <View><Text> title={item.title}</Text></View>}
          renderSectionHeader={({section}) => <View><Text> title={section.key}</Text></View>}
          sections={this.selectionList()}
        />
      </View>
    )
  }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!