react-native 报错 Changing onViewableItemsChanged on the fly is not supported

程和蔼
2023-12-01

对于这个错基本网上的方案都是this指向问题,由于本人用的hooks,来写类似抖音的页面,所以我这里必须用useRef 接收一下,下面是写法


export default function HomeListPage(props:any) {
  const [listData, setListData] = useState([0, 1, 2]);
  const renderItem = ({item, index}) => {
    return (
      <HomeStarCard/>
    );
  };
  useEffect(()=>{
  })
  const onSegmentedBarChange = (index: number) => {

  };
  const onViewRef = React.useRef((viewableItems)=> {setListData([3,4,5,6,4,6,7])})
  const viewConfigRef = React.useRef({ viewAreaCoveragePercentThreshold: 80 })
  return (
    <View style={[Base.s_h,Base.s_w]}>
        <FlatList
          data={listData}

          renderItem={({item, index}) => renderItem({item, index})}
          horizontal={false}
          pagingEnabled={true}
          getItemLayout={(data, index) => {
            return {length: screen_h, offset: screen_h * index, index};
          }}
          keyExtractor={(item, index) => index.toString()}
          showsHorizontalScrollIndicator={false}
          onViewableItemsChanged={onViewRef.current}
          viewabilityConfig={viewConfigRef.current}
        />
    </View>
  );
}

 类似资料: