1

1 首先要用到他的一个属性 row-key
2 还有就是 expand-row-keys

第一步

    <el-button type="primary" @click="hangshou">全部显示</el-button>
    <el-button type="success" @click="hanghide">全部隐藏</el-button>
    <el-table
      :data="tableData5"
      style="width: 100%"
      :expand-row-keys="expends"
      :row-key="getRowKeys">
      <el-table-column type="expand">
        <template slot-scope="props">
          <el-table
            ref="multipleTable"
            :data="tableData3"
            style="width: 100%">
            <el-table-column
              label="日期"
              align="left">
              <template slot-scope="scope">{{ scope.row.date }}</template>
            </el-table-column>
            <el-table-column
              prop="name"
              label="姓名"
              align="center"
              width="150">
            </el-table-column>
            <el-table-column
              prop="address"
              label="地址"
              width="150"
              align="center"
              show-overflow-tooltip>
            </el-table-column>
          </el-table>
        </template>
      </el-table-column>
      <el-table-column
        label="商品 ID"
        prop="id">
      </el-table-column>
      <el-table-column
        label="商品名称"
        prop="name">
      </el-table-column>
      <el-table-column
        label="描述"
        prop="desc">
      </el-table-column>
    </el-table>
    
    
    第二步
    
    
      data () {
        return {
            expends: [],
        },
        methods: {
          getRowKeys (row) {
            return row.id
          },
          // 全部隐藏
          hanghide () {
            this.expends = []
          },
          // 全部显示
          hangshou () {
            var tranId = this.tableData5.map(item => item.id)
            this.expends = tranId
          },
          
          
  这样就能应按钮控制table 的去全部展示 和 隐藏了

小懵逼
4 声望0 粉丝