首页 > 解决方案 > react native recyclerlistview 只渲染一项

问题描述

我使用 recyclerlistview 并希望在单击时更改图标。但是 Recyclerlistview 不会重新渲染,除非我使用 extendState。但是随后所有行都发生了变化并且速度很慢。也许我的新图标不是直接在 0.500-800 毫秒内显示的。为什么 ?

一个小片段只是一个例子。


const List = () => {
  const [changeIcon, setChangeIcon] = useState(false);
  const [updateRecycler, setUpdateRecycler] = useState({update: false})
  const updateRecycler = () => {
    setChangeIcon(prevState => !prevState);
    setUpdateRecycler(prevState => !prevState);
  };

  const rowRenderer = (type, data) => {
    const { name } = data.item;
    return (
      <View>
        <TouchableOpacity onPress={() => ChangeIcon()}>
          { changeIcon ?
            <Icon1 name="heart" size={32} color="black" /> : <Icon1 name="heart-o" size={32} color="black" />
          }
        </TouchableOpacity>
      </View>
    )
  };

  <RecyclerListView
    style={{flex: 1,  paddingTop: 20}}
    rowRenderer={rowRenderer}
    extendedState={updateRecycler}
    optimizeForInsertDeleteAnimations
    dataProvider={dataList}
    layoutProvider={dataLayoutProvider}
  />

};

标签: react-nativeexporecyclerlistview

解决方案


推荐阅读