vue filters

475 阅读1分钟

1.自定义的过滤器,用于格式化文本
2.定义:

export default {
    data() {
        return {
           money = 5.2100
        }
    },
    filters: {
    	// 截取保留两位小数(不4舍5入)
        twoDecimal (value) {
            // 截取当前数据到小数点后三位
            let tempVal = parseFloat(value).toFixed(3)
            let realVal = tempVal.substring(0, tempVal.length - 1)
            return realVal
        }
    }
}

3.使用:可以用在两个地方。1 双花括号中,2 v-bind中

{{ money | twoDecimal }}
{{  文本字符串 |  过滤函数  }}

<div v-bind:id="money | twoDecimal"></div>

4.串联使用:

{{ money | twoDecimal | filter1 | filter2 }}
{{ 文本字符串 | 过滤函数1 | 过滤函数2 | 过滤函数3 }}