尝试让FlatList显示来自Firebase的数据。 安装是正确的,我可以在我的控制台中看到日期,但不知道如何可视化它。
我想在列表中看到'recipeOne''recipeTwo''recipeThree'。 我确信我遗漏了一些基本的东西。
这是代码
...
import {DataConfig} from '../data/DataConfig';
const firebaseApp = firebase.initializeApp(DataConfig);
globalTexts = require('../styles/Texts.js');
globalColors = require('../styles/Colors.js');
export default class ListSort extends Component {
constructor(props) {
super(props);
this.dataItem = firebaseApp.database().ref('recipes');
this.state = {
item: []
}
};
componentWillMount() {
this._createItemList();
};
_createItemList = (dataItem) => {
this.dataItem.on('value', (snapshot) => {
var itemList = [];
snapshot.forEach((doc) => {
itemList.push({
key:doc.key,
itemType: doc.toJSON()
});
this.setState({item: itemList});
console.log(this.state.item);
})
})
};
render() {
return (
<View style={styles.container}>
<FlatList
data={this.state.item}
renderItem={({item, index}) => (
<View style={styles.cell}>
<Text style={globalText.btnFlatPrimary}>{item.recipes}</Text>
</View>
)}
/>
</View>
)
}
}
这是数据。 Firebase中的规则设置为read:仅true。
{
"recipes": {
"recipeOne": {...
"recipeTwo": {...
"recipeThree": {...
}
}