element-ui el-table 组件实现跨表格多选

element-ui 实现跨表格多选

效果

代码

<el-table row-key="id" :data="dataList" border @selection-change="selectionChangeHandle" style="width: 100%;">
      <el-table-column reserve-selection type="selection" header-align="center" align="center" width="50">
      </el-table-column>
      ...
    </el-table>

跟默认的选中效果区别在于

• <el-table> 标签上加上了 row-key="id" 属性(key 应该可以等于其他的值)
  • 让翻页的多选可以默认选中
• <el-table-column> 标签上加了 reserve-selection 属性
  • 让其支持翻页多选