Element-Plus 表格 el-table 如何支持分页多选

简介: Element-Plus 表格 el-table 如何支持分页多选

代码


在 el-table-column 设置属性 reserve-selection 为 true 即可,代码如下

<el-table
   ref="tableRef"
   v-loading="loading"
   :data="list"
   row-key="id"
   @selection-change="handleSelectionChange"
 >
   <el-table-column
     type="selection"
     width="80"
     align="center"
     :reserve-selection="true"
   />
   <!--...-->
</el-table>
<script setup lang="ts">
const selectedIds = ref<number[]>([]); // 选中的行ID
/** 行选中 change 事件 */
function handleSelectionChange(rows: any[]) {
  selectedIds .value = rows.map(
    (item: any) => item.id
  );
}
</script>

开源项目


  • 微服务商城项目


前后端分离项目

相关文章
|
11月前
|
JavaScript
Vue表格显示问题:v-show无法影响el-table-column列的解决方案
Vue表格显示问题:v-show无法影响el-table-column列的解决方案
339 0
|
9月前
|
JavaScript
element-UI el-table动态显示隐藏列造成固定一侧的列(fixed=“left/right“)错误显示
问题原因:多个tabs共用一个实体,动态显示隐藏列 出现了固定在右侧的列(fixed="right")错位 【解决方案】 表格的重新布局,只要table数据发生变化的时候就重新渲染表格 ```js this.$nextTick(() => { this.$refs.formname.doLayout() }) ``` 参考element官方文档 ![请在此添加图片描述](https://developer-private-1258344699.cos.ap-guangzhou.myqcloud.com/column/article/5877188/20231030-e40
162 0
element-UI el-table动态显示隐藏列造成固定一侧的列(fixed=“left/right“)错误显示
Element el-select 选择器(下拉框)详解
本文目录 1. 用途 2. 数据绑定 2.1 固定选项 2.2 选项绑定数组 3. 功能效果 3.1 可清空选项 3.2 多选 3.3 可搜索 4. 事件响应 5. 小结
4894 0
Element el-select 选择器(下拉框)详解
|
1月前
|
JavaScript 前端开发
table表格和下拉组件中data为什么必须是一个函数?
table表格和下拉组件中data为什么必须是一个函数?
|
2月前
基于sortablejs实现拖拽element-ui el-table表格行进行排序
基于sortablejs实现拖拽element-ui el-table表格行进行排序
|
8月前
element Table表格隐藏列
element Table表格隐藏列
187 0
|
10月前
|
JavaScript
el-select下拉多选框 el-select 设置默认值不可删除功能
Element-UI是一款广泛使用的Vue.js组件库,其中El-Select下拉多选框组件在实际项目开发中经常被使用。然而,在Element 3.0版本中,El-Select下拉多选框默认值可被删除,这可能会导致一些意外情况。本文将介绍如何解决这个问题,实现El-Select下拉多选框设置默认值不可删除的功能。
362 0
el-select下拉多选框 el-select 设置默认值不可删除功能
Element-ui 表格 (Table) 组件中动态合并单元格
Element-ui 表格 (Table) 组件中动态合并单元格
633 0
Element-ui 表格 (Table) 组件中动态合并单元格
可编辑多选el-select element源码(整理)
可编辑多选el-select element源码(整理)
element中el-select下拉框位置错乱问题
element中el-select下拉框位置错乱问题
378 0