需求是这样的，一个房主屋里面有多个电表，每一个表是一个账户，一次只能给一个账户缴费，在点击go按钮进行缴费，这个时候判断是否跨表勾选，跨表格勾选则弹窗提示，反之符合需求，走缴费逻辑
上代码
<!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><meta name="author" content="杨欣"><title></title><link rel="stylesheet" href="../public/css/element.css"><script src="../public/js/vue.js"></script><script src="../public/js/elementui.js"></script><style>html,body {margin: 0;padding: 0}</style> </head><body><div id="app"><div class="info" v-for="(item, index) in info" :key="index"><div>表{{index+1}}</div><el-table :header-cell-style="getRowClass" ref="multipleTable"@selection-change="handleChange($event,index)" :data="item.list"style="width: 100%;margin-bottom: 50px"><el-table-column type="selection" width="50"></el-table-column><el-table-column prop="id" label="id" width="180"></el-table-column><el-table-column prop="name" label="姓名" width="180"></el-table-column><el-table-column prop="age" label="年龄"></el-table-column><el-table-column prop="address" label="地址"></el-table-column></el-table></div><el-button type="primary" @click="go">go</el-button></div><script>let app = new Vue({el: "#app",data: {info: [{list: [{id: 1,name: 'aa',num: 1,age: 15,address: "adafadfas"},{id: 2,name: 'bb',num: 1,age: 15,address: "badfadf"},{id: 3,name: 'cc',num: 1,age: 15,address: "cafasdfad"},],},{list: [{id: 4,name: 'dd',num: 2,age: 15,address: "ddafadff"},{id: 5,name: 'ee',num: 2,age: 15,address: "efadfaf"},{id: 6,name: 'ff',num: 2,age: 15,address: "fdfasfew"},]}],multiSelectData: [],},methods: {handleChange(e, index) {this.multiSelectData[index] = e;//创建一个二维数组console.log(this.multiSelectData)},go() {let multiSelectData = this.multiSelectData;let multiSelectDataTemp = multiSelectData.filter((val, index, arr) => {return val.length > 0})//过滤掉为空的数组let len = multiSelectDataTemp.length;if (len > 1) {this.$message({type: 'error',message: "you have a bug"})}},//表头样式 getRowClass({row,column,rowIndex,columnIndex}) {if (rowIndex == 0) {return "background:#EFEFEF";} else {return "";}},},})</script> </body></html>
