element的el-table 解决表格多页选择数据时,数据被清空

问题:切换页码时,勾选的数据会被清空

重点看我圈出来的,直接复制,注意,我这里 return row.productId;一般大家的是 return row.id,根据接口定的唯一变量

复制代码
 :row-key="getRowKeys"​​​​​​​

 :reserve-selection="true"

  getRowKeys(row) {
        return row.productId;
      },

官方解说

参考我项目里的下方代码

复制代码
 <el-table v-loading="listLoading"
              :data="list"
                ref="multipleTable"
              border
              fit
              @selection-change="handleSelectionChange"
            :row-key="getRowKeys"
              highlight-current-row>
      <el-table-column
      :reserve-selection="true"
        type="selection"
        width="40">
      </el-table-column>
      <el-table-column align="center"
                       width="180px"
                       label="销售单号">
        <template slot-scope="scope">
          <span>{{ scope.row.orderId }}</span>
        </template>
      </el-table-column>
    </el-table>


  data () {
    return {
  getRowKeys(row) {
        return row.productId;
      },
rowSelection:'',
    }


  methods: {
  handleSelectionChange(val) {
      this.rowSelection = val;
 
    },
}
相关推荐
Yolanda947 小时前
【项目经验】钉钉免密登录实现
前端·javascript·钉钉
摘星编程7 小时前
在OpenHarmony上用React Native:collapsable节点优化策略
javascript·react native·react.js
ttod_qzstudio7 小时前
Vue 3 中 toRaw 的取舍之道:以 Babylon.js 3D 开发为例
vue.js·babylonjs
Beginner x_u7 小时前
JavaScript 原型、原型链与原型继承的核心机制解析
开发语言·javascript·原型模式·原型原型链
Mr Xu_8 小时前
Vue3 + Element Plus 实战:App 版本管理后台——动态生成下载二维码与封装文件上传
前端·javascript·vue.js
比特森林探险记8 小时前
Vue基础语法与响应式系统详解
前端·javascript·vue.js
2601_949847758 小时前
Flutter for OpenHarmony 剧本杀组队App实战:邀请好友功能实现
开发语言·javascript·flutter
FITA阿泽要努力8 小时前
Agent Engineer-Day 1 初始智能体与大语言模型基础
java·前端·javascript
zihan03218 小时前
element-plus, el-table 表头按照指定字段升降序的功能实现
前端·vue.js·状态模式
三翼鸟数字化技术团队9 小时前
watchEffect的两种错误用法
前端·javascript·vue.js