table设置了highlight-current-row,可以在选中某个数据行时,高亮该行。 table设置了@row-click="handleRowClick",绑定了行点击事件,用于获取被点击的行数据。 table设置了ref="table",用于script中获取table对象并对其进行操作,通过this.$refs.table即可拿到。 另外这里放了一个button,绑定了一个属性disabled,当有数...
设置选中状态 这里使用this.$nextTick是保证表格渲染完成之后,才添加选中效果。 selectedItem是筛选循环当前行row是否在当前表格tableData数据中。 rows.forEach(row => { this.$nextTick(() => { let selectedItem = this.tableData.find(item => item.id == row.id) this.$refs.multipleTable.toggleRowSel...
1.获取选中的数据 2.循环比对 //默认选中defaultChecked(){varthat=this;that.$nextTick(()=>{this.tableData.forEach((v,i)=>{this.multipleSelection.forEach((i,index)=>{if(v.orgName==i.orgName){this.$refs.dataTable.toggleRowSelection(v,true);}})});});}, 解决方法是使用 $nextTick $...
data(){return:{multipleSelectionAll:[],//所有选中的数据包含跨页数据allCheck:false,indeterminate:false,tableList:[],//列表数据-请求得到或自定义total:0,//得到的列表总数checkedList:[],//选中列表uncheckedList:[],//未选中列表}},watch:{//监听列表,如果为所有全选,翻页时保持状态tableList:{handler(...
</el-table> 1 2 3 4 5 6 7 that.selectionKeys.forEach(key => { that.discountList.forEach(row => { if(row.id== key.id) { that.$refs.multipleTable.toggleRowSelection(row,true); } }) })//这段只是具体逻辑,不包含获取数据 selectionKeys是需要回显的已选中选项,discountList是整个列表的...
selectIds.push(row[idKey]);//如果总选择里面不包含当前页选中的数据,那么就加入到总选择集合里if(selectAllIds.indexOf(row[idKey]) < 0) { that.multipleSelectionAll.push(row); } }) let noSelectIds=[];//得到当前页没有选中的idthis.tableData.forEach(row=>{if(selectIds.indexOf(row[idKey...
1. 获取多选数据 在Table组件中,多选功能需要开启selection属性,同时需要设置selection-change事件来获取多选数据。在事件处理函数中,可以通过参数selection获取当前选中的数据。 ``` <template> <el-table :data="tableData" :selection="selection" @selection-change="handleSelectionChange"> <el-table-column type=...
ElementUI 中 el-table 获取当前选中行的index 2019-11-28 14:34 − ... wbytts 0 10209 相关推荐 如何给el-table中的行添加class 2019-12-25 17:01 − 在el-table里有这么一个属性row-class-name,是一个回调函数,可以给el-table__row加class。 举个栗子: template 1 <el-table :data="data...
</el-table> export defalut { data() { return { radioStatus: false, // 是否被选中,默认都是 false selectedId: '' //选中数据的id } }, methods: { // 获取选中数据 getRowSelected(index, row) { this.selectedId = row.id } }
即通过Array.shift()方法删除第一条数据并返回新数组,这样就可以把select 事件中的以获取的数组给删掉,同时通过toggleRowSelection方法将删掉的这一行选择状态设置为未选择。 但是此时,table表头的”全选框“还是在的,它的存在会影响单选的使用,因此还需借用table的header-cell-class-name属性,重新设置其样式将该”全...