search

SmileZXLee / uni-z-paging

【uni-app下拉刷新、上拉加载】高性能，全平台兼容。支持vue、nvue、vue2、vue3，使用wxs+renderjs实现。支持虚拟列表，支持自定义下拉刷新、上拉加载更多，支持自动管理空数据图、点击返回顶部，支持聊天分页、本地分页，支持国际化等100+项配置
https://z-paging.zxlee.cn
MIT License
871 stars 69 forks source link

使用resetTotalData方法更新页面数据显示问题 #135

Closed libian2540926286 closed 2 months ago

libian2540926286 commented 4 months ago

编译平台 使用HbuilderX还是npm方式编译出现的问题？（如：HbuilderX）

VUE版本 vue3

运行平台 h5

z-paging版本 v2.7.6

问题描述 在使用后端翻页场景下，在翻页过程实现全选逻辑，使用resetTotalData方法更新页面选中状态时，resetTotalData中装了40条数据，但是渲染出来数据的id="zp-id-undefined"或者id="zp-id-43"等，点击获取到的rowIndex大于数据条数，麻烦大佬帮忙看下。 或者帮忙提供下更合理的更新、插入、删除数据的案例demo，谢谢！。 image

SmileZXLee commented 4 months ago

如果实现全选逻辑，只需要修改所有item的选中状态即可。不要使用resetTotalData去进行重新赋值。如果是vue2可以使用this.$set进行响应式赋值

libian2540926286 commented 4 months ago

谢谢答复，这种修改数据item的方法可以实现数据的更新操作，那对于插行和删行操作不使用resetTotalData的话应该如何操作呢？

SmileZXLee commented 4 months ago

谢谢答复，这种修改数据item的方法可以实现数据的更新操作，那对于插行和删行操作不使用resetTotalData的话应该如何操作呢？

this.dataList.push, this.dataList.splice。如果是不固定高度的虚拟列表，还需要更新缓存的虚拟列表高度，具体文档中有对应方法

SmileZXLee commented 4 months ago

谢谢答复，这种修改数据item的方法可以实现数据的更新操作，那对于插行和删行操作不使用resetTotalData的话应该如何操作呢？

this.dataList.push, this.dataList.splice。如果是不固定高度的虚拟列表，还需要更新缓存的虚拟列表高度，具体文档中有对应方法

libian2540926286 commented 4 months ago

你好，我按照下面的方法插行操作，第一次页面20条数据，插行1条之后paingList是21条数据，下拉翻页返回20条数据之后paingList成了42条数据了，这种问题该如何解决麻烦帮忙看下吧？ image image image

SmileZXLee commented 4 months ago

在demo基础上修改并提供最小可复现demo

libian2540926286 commented 4 months ago

写了个简单的demo没有问题，问题已解决，感谢回复！！！