vue3 相比于 vue2 取消了很多的API, filter就在其中,但是我们可以使用其他方法替代vue2中的filter
通过 app.config.globalProperties 来注册一个全局都能访问到的属性
我们再来说说 app.config.globalProperties 是什么,如何使用,下面是官方给出的相关解释:
链接: vue官方文档
注意点:如果全局属性与组件自己的属性冲突,组件自己的属性将具有更高的优先级。
具体使用方法:
// main.js页面进行设置
const app = createApp(App);
type TestType = <T extends any>(val: T) => T;
// 注意: 这一步必须添加 亲自试过不加 定义的方法变量不能使用 会报红
declare module '@vue/runtime-core' {
export interface ComponentCustomProperties {
$test: TestType; //定义的$test的类型
$name: string; //定义的$name的类型
}
}
// 自定义全局方法/变量
app.config.globalProperties.$test=(val)=>{
return 'val'
};
app.config.globalProperties.$name = 'name'
template模版中如何使用
<template>
//定义的$test方法
<div>
方法: {{ $test('test') }}
</div>
//定义的$name方法
<div>
名称: {{ $name }}
</div>
</template>