VUE的表格也是像列表一样的循环，直接上代码 HTML：
<table id="actionTable" class="layui-table" lay-even="" lay-skin="row" style="overflow:auto;display: block;height:590px;"> <colgroup> <col width="150"> <col width="650"> <col width="600"> <col> </colgroup> <thead> <tr> <th style="text-align:center"><input type="checkbox" v-on:click="checkAll" v-model="checked"></th> <th style="text-align:center">操作代号</th> <th style="text-align:center">名称</th> </tr> </thead> <tbody> <tr v-for="action in actions"> <td style="text-align:center"><input type="checkbox" v-model="checkModel" :value="action.Id"></td> <td style="text-align:center">{{action.ActionCode}}</td> <td style="text-align:center">{{action.ActionName}}</td> </tr> </tbody> </table>JS：引入相关layUI和VUE的文件
var actionData = { actions: [], checked: false, checkModel: [] }; var actionVue = new Vue({ el: '#actionTable', data: actionData, methods: { checkAll() { if (this.checked) { this.checkModel = []; } else { this.actions.forEach((item) => { if (this.checkModel.indexOf(item.Id) == -1) { this.checkModel.push(item.Id) } }) } } }, watch: { checkModel() { if (this.checkModel.length == this.actions.length) { this.checked = true; } else { this.checked = false; } } } })