Vue过滤器的使用

作者：开发笔记 发布时间：2022-05-11 阅读：1

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>vue过滤器</title>
    </head>
    <body>
    <div id='app'>
        <h1>{{msg | filterName}}</h1>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script>
      var vm=new Vue({
        el:'#app',
        data:{
          msg:'1'     
        },
        filters: {
          filterName(val) {
            const filterNameMap = {
              '0': '待确认',
              '1': '待发货',
              '2': '待收货',
              '3': '待付款',
              '4': '待收款',
              '5': '已完成'
            }
            return filterNameMap[val]
          }
        }        
      })
    </script>
  </body>
</html>

本文标签：Vue 过滤器使用

原文链接：

版权说明： 本文由作者上传，本站仅提供存储服务，转载请注明原文链接

Vue过滤器的使用

你可能感兴趣的