table中是否显示、显示状态变更

1.按钮是否显示

<el-table-column label="Operation" width="90" align="center" fixed="right">
  <template slot-scope="scope">
      <el-button type="text" size="small" 
          v-if="scope.row.user!='Online Deposit'" @click="detail()">
          Detail</el-button>
  </template>
</el-table-column>

按钮中v-if判断是否显示

2.三目运算

<el-table-column prop="status" label="Status" width="150" align="center">
   <template slot-scope="scope">
       {{scope.row.status == 1 ? 'Succeeded' : scope.row.status == 2 ? 
        'Approvaling' : scope.row.status == 3 ? 'Cancelled': ''}}
   </template>
</el-table-column>

3.根据状态不同，显示状态不同

当状态为成功，重试按钮置灰
效果：

image.png

<el-table-column label="操作" min-width="90" align="center" fixed="right">
        <template slot-scope="scope">
          <el-button type="text" v-if="scope.row.recordStatus==1" disabled="true" size="small" @click="retry(scope.row)">重试</el-button>
          <el-button type="text" v-if="scope.row.recordStatus!=1" size="small" >重试</el-button>
          <el-button type="text" size="small" @click="detail(scope.row)">详情</el-button>
        </template>
      </el-table-column>