uniapp 自定义全局过滤器的二种方法

最新推荐文章于 2024-06-16 18:42:38 发布

自夏

最新推荐文章于 2024-06-16 18:42:38 发布

阅读量1.9k

点赞数 1

分类专栏： uniapp 深入理解ES6总结文章标签： es6 vue.js 前端

本文链接：https://blog.csdn.net/qq_39970857/article/details/113942142

版权

19 篇文章 0 订阅

订阅专栏

13 篇文章 1 订阅

订阅专栏

这篇博客介绍了在Vue中定义全局过滤器的两种方法。第一种是在main.js中直接编写，可能导致代码混乱；第二种是将过滤器方法放在单独的filters.js文件中，然后在main.js中引入并挂载，提高代码可维护性。通过这种方式，可以更好地组织和复用过滤器功能。

摘要由CSDN通过智能技术生成

Vue.filter('unitConverter', (num)=>{
  return num
})

			<u-row gutter="16">
				<u-col span="3">
					</u-icon>{{voidinfo | unitConverter}}
				</u-col>
			</u-row>

）
第一步创建一个 filters.js

export default {	
	getdatalis(data){
		return data
	},
}

第二步，在mian.js 引用创建的 filters.js过来在挂载到***filter***上面

filter 第一个参数为方法名,第二个参数为回调函数这里就使用for in 循环得到我们想要的key 以及回调函数，从而实现了全局过滤器的定义

import filters from "./xxx/filters";

for(let key in filters){
	
	Vue.filter(key,filters[key])
}

食用方法跟直接定义到mian.js一样

关注