使用filter完成了对订单状态的显示

2019-05-06  本文已影响0人  泪滴在琴上

项目中订单的状态多大7种,刚开始在html里面使用了三目运算符做的判断显示,显示效果极差,而且维护困难。但是采用filter不仅漂亮的多,后期的维护以及扩展都一幕了然

<div id="app">
        <ul>
            <!--添加两个过滤器,注意不要冲突,注意先后顺序-->
            <li v-for="item in list">{{item.id | statusToText | filterAdd2}}</li>
        </ul>
    </div>
filters: {
    statusToText(value) {
      let reValue;
      switch (value) {
        case 1:
          reValue = "代付款";
          break;
        case 2:
          reValue = "代发货";
          break;
        ... ...
      }
      return reValue;
    }
  }

或者

filters: {
    statusToText(value) {
      let reValue=new Map()
      reValue.set(1,'代付款')
      reValue.set(2,'代发货')
      ... ...
      return reValue.get(value);
    }
 }
上一篇下一篇

猜你喜欢

热点阅读