当前位置 : 主页 > 网页制作 > html >

vue 全局过滤器(单个和多个过滤器)

来源:互联网 收集:自由互联 发布时间:2021-06-12
参考:https://www.cnblogs.com/liujn0829/p/8622960.html https://blog.csdn.net/z8735058/article/details/76824548 一、单个过滤器 参考https://cn.vuejs.org/v2/guide/filters.html 二、多个过滤器 新建dfilter.js文件 const dfil

参考: https://www.cnblogs.com/liujn0829/p/8622960.html
https://blog.csdn.net/z8735058/article/details/76824548

一、单个过滤器

参考 https://cn.vuejs.org/v2/guide/filters.html

二、多个过滤器

    1. 新建dfilter.js文件
      const dfilters = {
          addZeroTwo: function(value) {
              var value = Math.round(parseFloat(value) * 100) / 100;   //注: 一定要用var声明,let会报错
              var arr = value.toString().split(‘.‘);
              if (arr.length === 1) {
                  return value.toString() + ‘.00‘;
              } else {
                  if (arr[1].length === 1) {
                      return value.toString() + ‘0‘;
                  }
              }
          },
          addZeroOne: function(value) {
              var value = Math.round(parseFloat(value) * 100) / 100;
              var arr = value.toString().split(‘.‘);
              if (arr.length === 1) {
                  return value.toString() + ‘.0‘;
              } else {
                  if (arr[1].length === 1) {
                      return value.toString() + ‘0‘;
                  }
              }
          }
      }
      export default dfilters;
    2. 在main.js中引入并注册(在new Vue前注册)
      import dfilters from ‘../static/js/dfilters‘;
      
      for (let key in dfilters) {
          Vue.filter(key, dfilters[key]);
      }
    3. 在组件中使用
      <span>原价:¥{{shopgoods.gprice|addZeroTwo}}</span>
网友评论