我想让我的 flatlist 可重复使用,但我在传递道具时遇到了一些困难。
可重用组件的代码
const ListItemView = function (props) {
console.log(props);
return (
<View>
<FlatList
//data={props.data}
keyExtractor={props.keyp}
renderItem={props.disptext}
/>
</View>
);
};
当我在道具上运行 console.log 时,我得到了这个
{"disptext": undefined, "keyp": [函数匿名]}
这就是我从父屏幕传递道具的方式
const keyf = () => {
console.log('keyf');
//for the key extractor
return (item => item.index);
};
const rendertext = () => {
console.log('rendertext');
//for rerender function of the flatlist
({ item }) => {
return (
<View>
<Text>holaa</Text>
<Text>{item.name}</Text>
</View>
);
}
};
return (
<View style={style.container}>
<ListItemView
//data={con}
keyp={keyf()}
disptext={rendertext()}
/>
</View>
);
};
请帮忙
答案 0 :(得分:0)
您正在直接调用该函数,但您只需要提供它的引用...以便仅在某些事件上调用它。 应该是这样的:
<ListItemView
//data={con}
keyp={keyf}
disptext={rendertext}
/>
或
<ListItemView
//data={con}
keyp={()=>keyf()}
disptext={()=>rendertext()}
/>