zoukankan      html  css  js  c++  java
  • vue 全局过滤器(单个和多个过滤器)

    参考: 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 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;

    在main.js中引入并注册(在new Vue前注册)

    import dfilters from '../static/js/dfilters';
    
    for (let key in dfilters) {
        Vue.filter(key, dfilters[key]);
    }

    在组件中使用

    <span>原价:¥{{shopgoods.gprice|addZeroTwo}}</span>
  • 相关阅读:
    环境变量
    多重继承
    参数检查(@property)
    限制属性绑定(__slots__)
    实例属性和类属性
    2017-11-28 中文编程语言之Z语言初尝试: ZLOGO 4
    2017-10-23 在各种编程语言中使用中文命名
    2017-11-27 汉化了十数个编译器的前辈的心得体会
    五行
    阴阳
  • 原文地址:https://www.cnblogs.com/mmzuo-798/p/13306638.html
Copyright © 2011-2022 走看看