React Native使用NativeBase-是否可以显示和自定义手风琴内容中包含多个数据集的数组?

问题描述 投票:0回答:1

使用NativeBase,我试图让Accordion内容显示JSX的多行以及稍后将要获取的一些JSON数据。

在我看到的所有示例中,内容都设置为一个简单的字符串,但我想将其用于更多内容。如果这是使用NativeBase的限制,我可以想到另一种方法,但这似乎应该很容易做到。

用于填充手风琴的示例数据:

  { title: "First Element", content: "Lorem ipsum dolor sit amet" },
  { title: "Second Element", content: "Lorem ipsum dolor sit amet" },
  {
    title: "Third Element",
    content: {
      description: "Lorem ipsum dolor sit amet",
      moreInfoItems: [
        { Item1: 1, Item2: 10, Item3: 225, Item4: 90 },
        { Item1: 2, Item2: 20, Item3: 325, Item4: 100 }
      ]
    }
  }
];
react-native native-base
1个回答
0
投票

是,可以,可以使用renderContent方法呈现特殊内容格式数据。

...
<Accordion
            dataArray={dataArray}
            animation={true}
            expanded={true}
            renderHeader={this._renderHeader}
            renderContent={this._renderContent}
          />
...

_renderContent(item){
   if( typeof(item.content) == "string"){
      return (<Text>{item.content}</Text>)
   }
   // if it is a json or array
    return (<Text
        style={{
          backgroundColor: "#e3f1f1",
          padding: 10,
          fontStyle: "italic",
        }}
      >
        {item.content.description}
      </Text>)
}

您要显示的内容,可以根据您的情况进行定义

© www.soinside.com 2019 - 2024. All rights reserved.