如何解决 'Tried to get frame for out of range index NaN' - React native flatlist？

Question

下面是使用过的代码，打开这个页面出现'Tried to get frame for out of range index NaN'.

我不明白问题出在哪里。请帮忙

import {FlatList} from 'react-native-gesture-handler';
import {SIZES, constants} from '../../constants';
const [row1Images, setRow1Images] = React.useState({
    ...constants.walkthrough_01_01_images,
    ...constants.walkthrough_01_01_images
  })

const row1FlatListRef = React.useRef()

<FlatList
   ref={row1FlatListRef}
   decelerationRate="fast"
   horizontal
   showsHorizontalScrollIndicator={false}
   listKey="Slider1"
   keyExtractor={(_, index) => `Slider1_${index}`}
   data={row1Images}
   renderItem={({item, index}) => {
     return (
       <View style={{width: ITEM_WIDTH,alignItems: "center",justifyContent: "center"}}>
         <Image source={item} style={{width: 110,height: 110}} />
       </View>
     )
   }}
/>

Answer 1

你被设置 row1Images 为 object 而不是 array。 data 传递给 FlatList 的道具应该是一个数组。

这样设置row1Images

const [row1Images, setRow1Images] = React.useState([
    ...constants.walkthrough_01_01_images,
    ...constants.walkthrough_01_01_images
  ])

如何解决 'Tried to get frame for out of range index NaN' - React native flatlist？

How to solve 'Tried to get frame for out of range index NaN' - React native flatlist?

react-native

flatlist