el-table ToggleRowSelection实现取消选中没效果（virtual-scroll）

努力往上爬de蜗牛2024-12-16 19:26

场景：就是在虚拟列表el-table选中之后点击查询默认之前选中的

现象：就是实现选中，但是无法去除勾选等等

问题发现：看定位的数据有多个一样的，我想着勾选之前先去掉勾选，但是没效果或者说"相同的数据"，this.$refs.chargeList.toggleRowSelection(arr, true)去这样做勾选，竟然出现多条看似一样的

复制代码

  <virtual-scroll
              ref="virtualScroll"
              :data="list"
              row-key="ids"
              :item-size="62"
              key-prop="ids"
              @change="(virtualList) => table.data = virtualList">
              <el-table
                :table-id="$route.path + ':chargeHistoryTable'"
                v-loading="table.loading"
                :height="virtualTableHeight"
                :data="table.data"
                ref="chargeList"
                row-key="ids"
                border
                @select="onSelect"
                @select-all="onSelectAll"
                @selection-change="handleSelectionChange"

看返回的数据基本一样但是这里的row-key 之前我绑定的是 ids, ids是我随机生成的，列表每行

ids: Math.random().toString(10).slice(2,10),

到此大家已经发现问题了吧，就是我第一次查询和第二次查询返回的列表内容是一样的，但由于我每行随机生成的ids不一样，调用 toggleRowSelection方法就认为这两个对象是不一样的。

注意注意这一点：

改动方法： row-key绑定成id 这里的id是后端返回的就是一样的坑死了