vue 中如何同时让多个 table 切换选中状态

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

已注册用户请登录

这是一个建于 2507 天前的主题，其中的信息可能已经有所发展或是发生改变。

目前想要实现的功能是在页面加载完多个表格之后，将这几个表格全部默认全选。现在在每个 table 中都有设置好 ref

 <el-col :span="7"> <el-card :body-style="{ padding: '0px' }"> <el-table ref="cmpt_vip_table" :data="cmpt_case_data.AdVIPCase" :max-height=600 @selection-change="AdSelectionChange"> <el-table-column type="selection" label="选择"> </el-table-column> <el-table-column label="AdVIPCase" prop="case_name"> </el-table-column> </el-table> </el-card> </el-col> <el-col :span="7"> <el-card :body-style="{ padding: '0px' }"> <el-table ref="cmpt_carousel_table" :data="cmpt_case_data.CarouselCase" :max-height=600 @selection-change="VipSelectionChange"> <el-table-column type="selection" label="选择"> </el-table-column> <el-table-column label="CarouselCase" prop="case_name"> </el-table-column> </el-table> </el-card> </el-col>

然后再 created()中实现默认全选的逻辑

 created() { this.$axios.get(this.get_regression_case_url) .then(respOnse=> { this.regression_case_data = response.data; this.$refs.sup_table.toggleAllSelection(); this.$refs.ad_table.toggleAllSelection(); this.$refs.vip_table.toggleAllSelection(); this.$refs.carousel_table.toggleAllSelection(); this.$refs.vod_table.toggleAllSelection(); }) .catch(e => { this.errors.push(e) }); },

但是实际上不能全部表格都全选，只有最后一个"vod_table"生效，且每次都是最后一个生效(有全选)