插件是用来增强Vue的
plugin.js
//定义插件export default {install(Vue){console.log("hello plugin",Vue)}}
之后我们在main.js中引入并使用插件
//应用插件
import plugins from "./plugins";
Vue.use(plugins)
我们发现我们在插件中用的Vue参数是什么呢?
发现返回了Vue的构造函数
hello plugin ƒ Vue (options) {
if ( true &&
!(this instanceof Vue)
) {
warn('Vue is a constructor and should be called with the `new` keyword');
}
this._init(options);
}
那么我们可以再次修改一下插件,加一个过滤的功能
//定义插件
export default {
install(Vue){
Vue.filter(
'myslice',function (value){
return value.slice(0,3)
}
)
}
}
修改School.Vue,这样修改 |slice
<template>
<div class="school">
<h2> 学校名称 {{ name | myslice}}</h2>
</div>
</template>
我们发现输出的内容不全了,只输出了 前三个字符
