美文网首页
使用filter完成了对订单状态的显示

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

作者: 泪滴在琴上 | 来源:发表于2019-05-06 17:16 被阅读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);
        }
     }
    

    相关文章

      网友评论

          本文标题:使用filter完成了对订单状态的显示

          本文链接:https://www.haomeiwen.com/subject/aeydoqtx.html