列表如何重置

[ninglei1993]

大佬，我有个小需求是tab切换改变列表中的数据，所有tab共用一个virtual-list，所以需要重置所有状态

[tingyuxuan2302]

大佬，我有个小需求是tab切换改变列表中的数据，所有tab共用一个virtual-list，所以需要重置所有状态

你使用的列表type是什么类型？现在碰到了什么问题？具体描述下

[ninglei1993]

是这样的，我的列表用的multi 类型的，然后我页面中有个tablayout 去左右滑动切换不同的列表，现在我想的是共用一个virtual-list，然后通过不断的重置数据，实现tab切换刷新。但是我发现我把list设置为空后，并不生效，貌似内部好多计算逻辑还是停留在上一次，所以想着有没有什么办法可以彻底清空当前列表的状态，然后重新设置数据。

[ninglei1993]

大佬或者说有下拉刷新清除数据的逻辑吗？直接设置list为新数据，页面渲染会出现闪动，猜测内部好多维护的变量没有重置导致

[tingyuxuan2302]

大佬或者说有下拉刷新清除数据的逻辑吗？直接设置list为新数据，页面渲染会出现闪动，猜测内部好多维护的变量没有重置导致

list重置之后，pageNum有重置吗

[ninglei1993]

大佬有的，把list赋值为[] ,pageNum = 1。

[tingyuxuan2302]

大佬有的，把list赋值为[] ,pageNum = 1。

list置空之后会触发onComplete事件。。。 这块multi的时候确实有点问题的，没有考虑到重置的时候将

wholePageIndex: 0,
isComplete: false,
twoList: [],
innerScrollTop: 0,

这几个参数滞空，你可以拉下代码来本地调试下，大概就是这几个参数的问题 还有个方案就是你用多个虚拟列表，记得设置id都是唯一的

[ninglei1993]

好的，非常感觉大佬解答~，话说我有15个标签，每个tab对应一个虚拟列表是不是也会造成渲染卡顿或者本身内存占用过多~~~

[huiergo]

我也遇到了这个问题，通过重置 以上四个属性 解决了， 但是出现了闪屏的问题，比如：twoList已经有了数据，点击tab切换，调用重置数据方法，清空twoList再设置数据， 会闪屏。这个怎么解决呢

[tingyuxuan2302]

我也遇到了这个问题，通过重置 以上四个属性 解决了， 但是出现了闪屏的问题，比如：twoList已经有了数据，点击tab切换，调用重置数据方法，清空twoList再设置数据， 会闪屏。这个怎么解决呢

清空的时候可以用骨架图代替列表展示，优化体验

[huiergo]

我也遇到了这个问题，通过重置 以上四个属性 解决了， 但是出现了闪屏的问题，比如：twoList已经有了数据，点击tab切换，调用重置数据方法，清空twoList再设置数据， 会闪屏。这个怎么解决呢

清空的时候可以用骨架图代替列表展示，优化体验 感谢大佬~ 已解决 👍🏻

[tingyuxuan2302]

我也遇到了这个问题，通过重置 以上四个属性 解决了， 但是出现了闪屏的问题，比如：twoList已经有了数据，点击tab切换，调用重置数据方法，清空twoList再设置数据， 会闪屏。这个怎么解决呢

清空的时候可以用骨架图代替列表展示，优化体验 感谢大佬~ 已解决 👍🏻

赏个star吧😂，嘿嘿，THKS

[yiyang-deep]

所以这个问题 代码内部解决了么

[tingyuxuan2302]

所以这个问题 代码内部解决了么

试下1.1.0版本(https://www.npmjs.com/package/taro-virtual-list/v/1.1.0)

[yiyang-deep]

所以这个问题 代码内部解决了么

试下1.1.0版本(https://www.npmjs.com/package/taro-virtual-list/v/1.1.0)

还是会存在呀。哈哈哈

[tingyuxuan2302]

所以这个问题 代码内部解决了么

试下1.1.0版本(https://www.npmjs.com/package/taro-virtual-list/v/1.1.0)

还是会存在呀。哈哈哈

不应该吧，确实已经重置了，你是如何使用的

[yiyang-deep]

所以这个问题 代码内部解决了么

试下1.1.0版本(https://www.npmjs.com/package/taro-virtual-list/v/1.1.0)

还是会存在呀。哈哈哈

不应该吧，确实已经重置了，你是如何使用的

邮件发给你了。

[rockliuxn]

@tingyuxuan2302 列表不能置空的问题依然存在

[rockliuxn]

@huiergo 请问参数是如何重置的？

[tingyuxuan2302]

@tingyuxuan2302 列表不能置空的问题依然存在

你在改变list的时候，切记不要修改到原list，也就是说你需要深拷贝一份list出来，然后置空

[rockliuxn]

@tingyuxuan2302 列表不能置空的问题依然存在

你在改变list的时候，切记不要修改到原list，也就是说你需要深拷贝一份list出来，然后置空

我尝试在list 赋值之前，先对其进行深拷贝了一下，但是依然不能置空，代码如下：

const { orderList } = this.state;

async () => {
      const list = await incomeApi.getList();

      let _orderList = JSON.parse(JSON.stringify(orderList))

      _orderList =
        pageNum == 1 ? list.data : _orderList.concat(list.data);

      this.setState( {
        orderList: _orderList,
      });
 }

@tingyuxuan2302 不知道是否这种写法有误， 能否提供一个简单的demo！ 🤝

[tingyuxuan2302]

@tingyuxuan2302 列表不能置空的问题依然存在

你在改变list的时候，切记不要修改到原list，也就是说你需要深拷贝一份list出来，然后置空

我尝试在list 赋值之前，先对其进行深拷贝了一下，但是依然不能置空，代码如下：

const { orderList } = this.state;

async () => {
      const list = await incomeApi.getList();

      let _orderList = JSON.parse(JSON.stringify(orderList))

      _orderList =
        pageNum == 1 ? list.data : _orderList.concat(list.data);

      this.setState( {
        orderList: _orderList,
      });
 }

@tingyuxuan2302 不知道是否这种写法有误， 能否提供一个简单的demo！ 🤝

src/pages/virtual-list-demo/index.tsx，这是demo，另外你改list的时候，pageNum有跟着变更吗

[tingyuxuan2302]

@tingyuxuan2302 列表不能置空的问题依然存在

你在改变list的时候，切记不要修改到原list，也就是说你需要深拷贝一份list出来，然后置空

我尝试在list 赋值之前，先对其进行深拷贝了一下，但是依然不能置空，代码如下：

const { orderList } = this.state;

async () => {
      const list = await incomeApi.getList();

      let _orderList = JSON.parse(JSON.stringify(orderList))

      _orderList =
        pageNum == 1 ? list.data : _orderList.concat(list.data);

      this.setState( {
        orderList: _orderList,
      });
 }

@tingyuxuan2302 不知道是否这种写法有误， 能否提供一个简单的demo！ 🤝

src/pages/virtual-list-demo/index.tsx，这是demo，另外你改list的时候，pageNum有跟着变更吗

[rockliuxn]

@tingyuxuan2302 列表不能置空的问题依然存在

你在改变list的时候，切记不要修改到原list，也就是说你需要深拷贝一份list出来，然后置空

我尝试在list 赋值之前，先对其进行深拷贝了一下，但是依然不能置空，代码如下：

const { orderList } = this.state;

async () => {
      const list = await incomeApi.getList();

      let _orderList = JSON.parse(JSON.stringify(orderList))

      _orderList =
        pageNum == 1 ? list.data : _orderList.concat(list.data);

      this.setState( {
        orderList: _orderList,
      });
 }

@tingyuxuan2302 不知道是否这种写法有误， 能否提供一个简单的demo！ 🤝

src/pages/virtual-list-demo/index.tsx，这是demo，另外你改list的时候，pageNum有跟着变更吗

每次更新list的时候，pageNum都会改变； list置空时，pageNum=1

demo我看了一下，主要演示了list 滚动加载数据的方法，数据置空的方法并没有提及，能否增加一个数据清空，然后深拷贝的demo，感谢！ ☕️

[zjjjjjjjjjjd]

同样的问题，清空的时候数据没变

[tingyuxuan2302]

同样的问题，清空的时候数据没变 代码示例提供一下，这样说无法定位问题

[zjjjjjjjjjjd]

<TaroVirtualList
 listType='multi'
 liist={list}
/>

list 有了数据之后，再次值为空数组时，列表数据没有消失

[zjjjjjjjjjjd]

<TaroVirtualList
 listType='multi'
 liist={list}
/>

list 有了数据之后，再次值为空数组时，列表数据没有消失 只能这样处理了

<TaroVirtualList
listType='multi'
liist={list.length ? list: [{}]}
onRender={list.length ? getItem : () => <View style={{ height: 1 }}></View>}
/>

处理成：为空的时候不是真正的为空，渲染一个高度为1的占位元素（试过给个null还会一直闪屏，发现虚拟块的高度一致变化导致的）

[tingyuxuan2302]

<TaroVirtualList
 listType='multi'
 liist={list}
/>

list 有了数据之后，再次值为空数组时，列表数据没有消失

你是直接修改的list引用吧，上边回答说了需要深拷贝出来再赋值