vue+element 搭建后台小总结动态改变button中的状态

最新推荐文章于 2024-08-16 16:49:58 发布

WinterWang0207

最新推荐文章于 2024-08-16 16:49:58 发布

阅读量2.5k

点赞数

分类专栏： Vue 案例

本文链接：https://blog.csdn.net/weixin_38404899/article/details/101289200

版权

Vue 案例专栏收录该内容

91 篇文章 10 订阅

订阅专栏

功能：点击单行的button 改变其状态

代码部分：

判断表格中scope.row.status和identity的状态来设置不同的可见的button

 <el-table-column
         prop="customerName"
         label="操作"
         min-width="80"
         align="center"
         fixed="right"
          >
         <template slot-scope="scope">
             <el-button v-if="scope.row.status=='正常'&& scope.row.identity=='成员'" type="primary" size="medium"  @click="Shutup_this(scope.$index, scope.row)">禁言</el-button>
             <el-button v-else-if="scope.row.status=='黑名单' && scope.row.identity=='成员'"  type="primary" size="medium"  @click="cancel_Blacklist(scope.$index, scope.row)">取消黑名单</el-button>
             <el-button v-else-if="scope.row.status=='禁言' && scope.row.identity=='成员'" type="primary" size="medium"  @click="cancel_Shutup(scope.$index, scope.row)">取消禁言</el-button>
         </template>
</el-table-column>