Helo伙计们,我是React Native的新手。我正在练习Flat List。我将一些静态数据放在 flatListData.js 中作为JSON格式,实际代码在 BasicFlatList.js 中。并希望将其加载到Flat List中。但是得到错误。我正在使用模拟器输出。
这是我的 BasicFlatList.js 文件:
import React, {Component} from 'react';
import { ActivityIndicator, StyleSheet, Text, View,Image, FlatList } from 'react-native';
import flatListData from '../data/flatListData'
class FlatListItem extends React.Component{
render(){
return(
<View>
<Text>this.props.item.name</Text>
</View>
);
}
}
export default class FlatList extends Component {
render() {
return (
<View style = {{flex:1, marginTop:10}}>
<FlatList>
data = {flatListData}
renderItem = {({item, index})=>{
return(
<FlatListItem item={item} index={index}>
</FlatListItem>
);
}}
</FlatList>
</View>
);
}
}
这是 flatListData.j 的文件:
var flatListData = [
{
"key" : "t57t76e578tyre8gfret6",
"name" : "banana",
"foodDescription" : "healthy",
},
{
"key" : "t745turehf8er7tr64r",
"name" : "banana",
"foodDescription" : "healthy",
}
];
module.exports = flatListData;
这是 index.js 文件:
import { AppRegistry } from 'react-native';
import FlatList from './components/BasicFlatList';
AppRegistry.registerComponent('FirebaseEmailLoginTest', () => FlatList);