如何在React Native中存储数据列表?

时间:2018-10-11 18:05:49

标签: reactjs react-native mobile expo

我是React Native的初学者,我想知道如何才能将数据列表存储在可以在屏幕上显示为文本的文件中?例如,我想根据日期存储不同的工作时间表。那么,我可以存储一堆不同的固定时间表并能够根据当天的数据显示数据的一种方法是什么?我正在将React Native与Expo一起使用。感谢您的任何帮助,谢谢!

1 个答案:

答案 0 :(得分:0)

最有可能是FlatList组件。它可以通过一堆配置灵活地呈现数据。

这是一个简单的示例,其中包含一组数据,一个渲染项方法以及列表本身

renderItem(item) {
return (
  <View>
   <Text> {item.key} + {item.employee1}</Text>
  </View>
);
}

const scheduleData = [
 {key: 'Monday', employee1: "john"},
 {key: 'Tuesday', employee1: "jep"},
 {key: 'Wednesday' , employee1: "jabouris"},
 {key: 'Thursday', employee1: "jennifer"},
 {key: 'Friday', employee1: "jenalyn"},
 {key: 'Saturday', employee1: "josh"},
 {key: 'Sunday', employee1: "jenna"}
 ];

 <FlatList
    data={scheduleData}
    renderItem={this.renderItem.bind(this)}
  />

renderItem将由类中的其他方法放置(在render方法之外),数据集被放置在返回值之外,而平面列表将被放置在返回值中。

更多示例和列表信息可在此处找到:React Native List Docs