我想避免不必要的重新呈现,所以我使用useMemo。
但我收到了以下错误消息:
TypeError: renderItem is not a function. (In 'renderItem(props)', 'renderItem' is an instance of Object)
编码:
import * as React from 'react';
import { StyleSheet, Text, View, TouchableOpacity, Image, Dimensions, FlatList } from 'react-native';
import faker from 'faker';
const { width, height } = Dimensions.get('window');
const Advertising = () => {
const data = [
{ id: '1', name: 'Jens', image: faker.image.avatar() },
{ id: '2', name: 'Günther', image: faker.image.avatar() }
];
const renderItem = React.useMemo(() => {
return (
<View>
<Text>Hello</Text>
</View>
)
}, [data]);
return (
<FlatList
data={data}
keyExtractor={item => Math.random(100).toString()}
renderItem={renderItem}
/>
)
};
const styles = StyleSheet.create({
container: {
flex: 1,
}
});
export default React.memo(Advertising);
......................................................................................................................................................................................................
2条答案
按热度按时间vuktfyat1#
useMemo
是一个react钩子,不能以那种方式使用react钩子。我建议您为this创建一个单独的组件。
然后像这样导入
还可以考虑使用CallBack
scyqe7ek2#
您必须在useMemo内将renderItem函数作为回调返回。
与...相同