javascript - React Native TypeError:未定义不是对象(评估'_ref.item')
问题描述
我正在尝试克隆 Instagram,但是在使用 FlatList 时出现此错误:
错误:TypeError:未定义不是对象(评估'_ref.item')
我在 youtube 上按照本教程进行操作,我的代码与视频中的代码基本相同,我相信可能由于视频是 1 年前上传的,文档已经更改。
使用 React Native Cli 和 android studio
import React, {Component} from "react";
import {FlatList} from "react-native";
import Post from "../presentation";
class PostFeed extends Component{
_renderPost({ item }) {
return <Post />;
}
_returnKey(item) {
return item.toString();
}
render() {
return (
<FlatList
data={[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]}
keyExtractor={this._returnKey}
renderItem={this._renderPost()}
/>
);
}
}
export default PostFeed;
这是 InstaClone.js
import React, {Component} from "react";
import { View, Text, StyleSheet, Image, Dimensions, TouchableOpacity } from "react-native";
import config from "./config";
import { PostFeed } from './components/container';
class InstaClone extends Component {
render() {
return (
<View style={{ flex: 1, width: 100+"%", height: 100+"%"}}>
<View style={styles.tempNav}>
<Text>Instagram</Text>
</View>
<PostFeed/>
</View>
);
}
}
export default InstaClone;
const styles = StyleSheet.create({
tempNav: {
width:100+"%",
height: 56,
backgroundColor:"rgb(250,250,250)",
borderBottomColor:"rgb(233,233,233)",
borderBottomWidth: StyleSheet.hairlineWidth,
justifyContent: "center",
alignItems: "center"
},
userBar: {
width:100+"%",
height: config.styleConstants.rowHeight,
backgroundColor: "#fff",
flexDirection: "row",
paddingHorizontal: 10,
justifyContent: "space-between"
},
userPic: {
height:40,
width:40,
borderRadius:20
},
iconBar: {
height: config.styleConstants.rowHeight,
width: 100 + "%",
borderColor:"rgb(233,233,233)",
borderTopWidth: StyleSheet.hairlineWidth,
borderBottomWidth: StyleSheet.hairlineWidth,
flexDirection: "row"
},
icon: {
marginHorizontal: 5
},
})
解决方案
您正在尝试解构 _renderPost 参数中的“项目”。没有传入对象,所以它在抱怨。
推荐阅读
- java - Axon 框架 - GZIP JSON 数据
- python - 无法在 Excel 文件中正确写入提取的文本
- selenium - 如何使用 appium 检查器检查 gmail 菜单下拉菜单
- python - 当熊猫的最大值达到阈值(或多或少)时保留组
- c++ - C++Builder 强制编译一个特殊文件
- c# - 如何在 Blazor 中的输入更改上绑定和运行异步方法
- image - 为什么每个人都在对 openCV 执行操作之前将图像转换为灰度
- mysql - 查询优化(多连接)
- node.js - req.params.userId not found ( path set to /:userId) Node.js
- android - Android Q openFd:java.io.FileNotFoundException:打开失败:EACCES(权限被拒绝)