我现在正在尝试使用useSelector和useDispatch。
home组件的顶部是这样的
import {useDispatch, useSelector} from 'react-redux';
import {fetchGuides} from '../ducks/modules/Articles';
const {windowWidth} = Dimensions.get('window');
const HomeScreen = ({navigation}) => {
const [loading, setLoading] = useState(true);
const dispatch = useDispatch();
const guideList = useSelector((state) => state.articlesReducer.guideList);
useEffect(() => {
setLoading(true);
dispatch(fetchGuides());
}[])
数据实际上进入这个home组件,但每当我刷新页面或关闭服务器并重新打开它时。下面的映射函数给了我一个undefined
错误。
错误是这样的guide.id === undefined
const guideCardGenerator = (guide) => (
<TouchableOpacity
key={guide.id}
onPress={() =>
navigation.navigate('GuidesDetails', {
screen: 'GuidesDetails',
params: {
title: guide.title,
author: guide.author,
},
})
}>
<Card style={styles.guidecard}>
<View style={styles.guidetextContainer}>
<Text style={styles.guidetextColor}>Guides</Text>
</View>
<Card.Content>
<Title>{guide.title}</Title>
<Paragraph>{guide.summary}</Paragraph>
</Card.Content>
</Card>
</TouchableOpacity>
);
let firstGuide = [];
for (let i = 0; i <= 1; i++) {
guideList && firstGuide.push(guideList[i]);
}
return (
<View>{firstGuide && firstGuide.map((guide) => guideCardGenerator(guide))}</View>
)
试试这个
let firstGuide = [];
for (let i = 0; i <= 1; i++) {
guideList && guideList[i] && firstGuide.push(guideList[i]);
}