首页   注册   登录
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
vue.js
V2EX  ›  Vue.js

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

  •  
  •   Alerta · 86 天前 · 604 次点击
    这是一个创建于 86 天前的主题,其中的信息可能已经有所发展或是发生改变。

    目前想要实现的功能是在页面加载完多个表格之后,将这几个表格全部默认全选。现在在每个 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"生效,且每次都是最后一个生效(有全选)

    4 回复  |  直到 2019-01-29 17:43:16 +08:00
        1
    Alerta   86 天前
    求助各位 vue 大佬,求助求助
        2
    Alerta   85 天前
    DING
        3
    Alerta   85 天前
    顶一顶,希望有大佬看到
        4
    ghostheaven   85 天前 via Android
    $nextTick 里跑 toggleAllSelection 试一下
    关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   2772 人在线   最高记录 5043   ·  
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.3 · 15ms · UTC 12:31 · PVG 20:31 · LAX 05:31 · JFK 08:31
    ♥ Do have faith in what you're doing.
    沪ICP备16043287号-1