VUE中 标签处理动态绑定状态 （0 进； 1出）

1.这是没有处理的状态

2.实现效果

3.代码如下

方法一：标签处理

<el-table-column prop="statu" label="进出状态">
  <template slot-scope="scope">
    <p>{{
      scope.row.statu=="0" ?"进" :"出"
     }}</p>
  </template>
</el-table-column>

方法二：filters过滤器

1. 标签上绑定filters过滤器的方法

<el-table-column prop="statu" label="进出状态">
  <template slot-scope="scope">
    <p>{{
      scope.row.statu | filterStatus
    }}</p>
  </template>
</el-table-column>

2. 过滤器处理

<script>
  export default {
    data() {
      return {}
    },
    filters: {
    filterStatus: (val) => {

      // 方法一：
      if(val == "0") {
        return '进'
      } else {
        return '出'
      }

      // 方法二
      let value = Number(val)
      let txt = ['进','出'][value]
      return txt

      // 方法三
      let value = Number(val)
      switch(value) {
        case 0 :
          return '进'
        break
        default :
          return '出'
        break
     }
  },
  }
</script>