控制状态的显示（最简单方法）

最新推荐文章于 2022-09-20 19:45:30 发布

程序媛之进击的菜鸟

最新推荐文章于 2022-09-20 19:45:30 发布

阅读量151

点赞数

本文链接：https://blog.csdn.net/weixin_53884488/article/details/125715227

版权

Vue.js v-if 动态渲染表格操作状态管理

关键词由CSDN通过智能技术生成

通过v-if控制自动切换状态

数据库存的状态为 0,1,2,3

<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button  v-if="scope.row.flag=='0'"
            size="mini"
            type="text"
            @click="handleUpdate(scope.row)"
            :disabled="scope.row.flag!=='0'?true:false"
          >确认</el-button>
       <el-button v-if="scope.row.flag=='1'" size="mini" type="text">未结算</el-button>
       <el-button v-if="scope.row.flag=='2'" size="mini" type="text">打款中</el-button>
       <el-button v-if="scope.row.flag=='3'" size="mini" type="text">已结算</el-button>
       </template>
</el-table-column>