鍍金池/ 問答/HTML/ vue+element項(xiàng)目 如何隱藏整行el-table-column

vue+element項(xiàng)目 如何隱藏整行el-table-column

<el-table :data="tableData" style="width: 100%;" @selection-change="handleSelectionChange" ref="multipleTable" class="exchangeTable">   
        <el-table-column align="center" type="selection" width="55" fixed></el-table-column>
        <el-table-column align="center" prop="name" label="方案名稱" width='120'></el-table-column>
        <el-table-column align="center" prop ="type" label="兌換類型">
          <template slot-scope="scope">
            {{ scope.row.type === 1 ? '禮品' : '券' }}
          </template>
        </el-table-column>
        <el-table-column align="center"  label="兌換個(gè)數(shù)" width="160px">
          <template slot-scope="scope">
             <!-- <el-col :span="16"> -->
            <el-input  v-model="scope.row.exchangeNum" class="exchangeNum" @change="inputChange(scope.row)"></el-input>
             <!-- </el-col> -->
          </template>
        </el-table-column>
        <el-table-column align="center" label="消耗積分" prop="costPointsNum">
           <template slot-scope="scope">{{scope.row.exchangeNum*scope.row.costPointsNum}}</template>
        </el-table-column>
        <el-table-column align="center" label="允許兌換最大數(shù)量" prop="eachMax"></el-table-column>
        <el-table-column align="center" label="剩余個(gè)數(shù)" prop="leftNum"></el-table-column>
      </el-table>

如上的table結(jié)構(gòu) 如何隱藏掉 剩余個(gè)數(shù) 為0的整行數(shù)據(jù) 不讓其展示

回答
編輯回答
耍太極

后臺(tái)取到的tableData過濾一下，把數(shù)據(jù)處理后再作展示。

2017年10月30日 02:52
編輯回答
糖果果

處理tableData呀，把個(gè)數(shù)為0的那一個(gè)刪了

2017年9月21日 12:24
編輯回答
笨小蛋

是否可以直接加一個(gè)v-if判斷？
這樣：

<el-table-column v-if="leftNum!=0" align="center" label="剩余個(gè)數(shù)" prop="leftNum"></el-table-column>
2017年8月21日 12:43