vue根据数字显示对应的文字状态（vue三元表达式多个判断）

第一种：（三元表达式多个判断）

   <el-table-column
          align="center"
          prop="type"
          label="处置类型"
          style="width: 10%"
        >
          <template slot-scope="scope">
            {{
              scope.row.type == 1
                ? "线下加油"
                : scope.row.type == 2
                ? "充值油卡"
                : scope.row.type == 3
                ? "扫码加油"
                : scope.row.type == 4
                ? "转售"
                : scope.row.type == 5
                ? "续持"
                : scope.row.type == 6
                ? "退款"
                : ""
            }}</template
          >
        </el-table-column>

显示样式：

 

第二种：

  <el-table-column  label="模板类型">
          <template slot-scope="scope">
                 {{options[scope.row.SiteType]['label']}}
          </template>
      </el-table-column>

computed:{
    computedSiteType(){
        return function(siteType){
            return this.options[siteType]['label']
        }
    },
}

 data(){
  options: [
    {
        value: "0",
        label: "全部"
    },
    {
        value: "1",
        label: "PC版"
    },
    {
        value: "2",
        label: "手机版"
    }...
  ],

显示样式：