测试过滤器单个参数
{{ content | contentFilter }}
测试过滤器多个参数
{{ javaScore | add(vueScore,pythonScore) }}
插件的作用
-
插件通常会为Vue添加全局功能,一般是添加全局方法/全局指令/过滤器等。
-
Vue插件有一个公开的方法 install ,通过 install 方法给 vue 添加全局功能。
-
通过全局方法 Vue.use() 使用插件,他需要在你调用 new Vue() 启动应用之前完成。
案例
创建插件
首先定义一个插件,创建js文件夹,在js文件夹中创建 plugins.js 文件
(function(){
// 声明 MyPlugin 插件对象
const MyPlugin = {}
MyPlugin.install = function (Vue, options) {
// 1. 添加全局方法或 property
Vue.myGlobalMethod = function () {
alert(“MyPlugin.myGlobalMethod 全局方法被调用了”)
}
// 2. 添加全局指令
Vue.directive(‘my-directive’, {
inserted (el, binding) {
// 逻辑…
el.innerHTML = “MyPlugin.my-directive 指令被调用了” + binding.value
}
})
// 3. 注入组件选项
// Vue.mixin({
// created: function () {
// // 逻辑…
// }
// })
// 4. 添加实例方法
Vue.prototype.$myMethod = function (value) {
// 逻辑…
alert(“Vue 实例方法myMethod被调用了:” + value)
}
}
// 将插件添加到window对象
window.MyPlugin = MyPlugin
})()