VUE代码优化(1)

VUE代码优化(1) - 全局过滤器

简述

使用vue中的Vue.filter方法实现代码的简洁开发,让冗余的代码变的舒爽。

Vue.filter

代码比较

不多说,直接上代码。

使用前

 使用后

 官方概述

Vue.js 允许你自定义过滤器,可被用于一些常见的文本格式化。过滤器可以用在两个地方:双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部,由“管道”符号指示。

如何使用

Vue.filter是全局方法,不过一般建议在main.js中使用,也可以单独写一个文件。

相对应的就是,nodeInfo.status就是传入的参数,nodeInfoStatus就是管道名称。

filter处代码优化

这么写是没问题,但是一个项目里面肯定是要有很多这种filter方法需要定义。

所以说要做一个汇总的文件,专门收集定义的方法。

定义一个filter文件。

 然后再

 代码就变得清爽很多了。

原文地址:https://www.cnblogs.com/lrqcx/p/14030304.html