目录
1、Html部分
- 1、Html部分
- 2、JavaScript部分
- 3、完整代码
<div id="app"> <el-table :data="tableData" border @selection-change="handleSelectionChange"> <el-table-column type="selection"> el: "#app", data() { return { tableData: [ { id: 1, name: '张三', age: 15 }, { id: 2, name: '李四', age: 16 }, { id: 3, name: '王五', age: 17 }, { id: 4, name: '赵六', age: 18 }, { id: 5, name: '田七', age: 19 } ], multipleSelection: [], options: [ { id: 1, value: 1, label: 'value1' }, { id: 2, value: 2, label: 'value2' }, { id: 3, value: 3, label: 'value3' }, { id: 4, value: 4, label: 'value4' }, { id: 5, value: 5, label: 'value5' } ], selectedVal: null } }, methods: { // 表格多选 handleSelectionChange(val) { this.multipleSelection = val; }, // 选择框触发 changeSelected(e) { // 利用了对象的引用类型特性 // 因为使用的是同一个地址 // 所以被选中的新数组改变了 // 旧数组也会跟着改变 this.multipleSelection.forEach(item => { item.age = item.age + e; }); } } });3、完整代码
gitee(码云) - mj01分支 - referenceAddress 文件夹