vue表格eltablecolumn数据翻译字段

问题背景:在做页面查询时,有一个状态位auth_status标志,后端返回的是代码,前端需要转译成对应的中文方便用户理解。

解决方法1)使用:formatter

          <el-table-column label="认证状态" prop="auth_status" :formatter="statusFormat">
          </el-table-column>

methods:{
      statusFormat(row,column){
        console.log(row.auth_status);
        var statusW;
        switch (row.auth_status) {
          case 120:statusW= "认证成功";break;
          case 110:statusW= "认证中";break;
          case 100:statusW= "未认证";break;
          case 130:statusW= "认证失败";break;
          case 140:statusW= "认证过期";break;
        }
        return statusW
      }
}

解决方法2)使用过滤器filters

          <el-table-column label="认证状态" prop="auth_status">
            <template slot-scope="scope">
              {{ scope.row.auth_status | mystatus(scope.row.auth_status)}}
            </template>
          </el-table-column>

      filters:{
        mystatus(myInput){
          console.log(myInput);
          console.log("sdsd");
          var statusW;
          switch (myInput) {
          case 120:statusW= "认证成功";break;
          case 110:statusW= "认证中";break;
          case 100:statusW= "未认证";break;
          case 130:statusW= "认证失败";break;
          case 140:statusW= "认证过期";break;
          }
        return statusW
        }
      }
  

作者:0981b16f19c7
链接:https://www.jianshu.com/p/b25ec450c000 
原文地址:https://www.cnblogs.com/javalinux/p/15634363.html