vue2.0+elementUI 解决表单上架下架状态的切换

1 HTML部分

<el-table-column label="商品状态" width="140" align='center'>
                    <template slot-scope="scope">{{scope.row.status | brand}}</template>
                </el-table-column>
                <el-table-column label="操作" width="360" align='center'>
                    <template slot-scope="scope">
                        <el-button type="text" size="small" @click="editdata(scope.row)">编辑</el-button>
                        <el-button type="text" size="small" id="onsgelf" @click="Transformation(scope.row)">{{scope.row.status == 0 ? "上架" : scope.row.status == 1 ? "下架" : "解锁"}}</el-button>
                        <el-button type="text" size="small" id="upon">卡券管理</el-button>
                    
                    </template>

js部分

filters: {
            brand(val) {
                var brand;
                if(val == 1) {
                    brand = "上架";
                } else if(val == 0) {

                    brand = "下架";

                }
                return brand
            },
        },

三目运算标配

<template slot-scope="scope">{{scope.row.type == 0 ? "实物卡券" : scope.row.type== 1 ? "虚拟卡券" : "未选择"}}</template>

总结:主要用到三目运算符在标签里来解决问题和使用过滤器,法子比较毛,但能解决问题

猜你喜欢

转载自blog.csdn.net/weixin_42507803/article/details/81910297