<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>plugs</title>
</head>
<body>
<div id="app">
<input type="text" v-input-focus>
<box :func="getMt"></box>
</div>
<script src="node_modules/vue/dist/vue.js"></script>
<script>
//定义插件
var plugs = {};
plugs.install = function(Vue,options){
Vue.mixin({
created () {
}
})
Vue.directive('input-focus',{
inserted (el,binding){
el.focus()
}
})
Vue.prototype.$common = () => {
return {
add () {
alert('add')
}
}
}
Vue.component('box',{
data(){
return {
style:{width:'1000px',height:'1000px',border:'1px solid #ccc'},
myfunc:this.func
}
},
template:`<div :style="style" @click="myfunc('hello word')"></div>`,
props:['func'],
mounted (){
console.log(this.myfunc)
}
})
}
//使用插件
Vue.use(plugs)
var vm = new Vue({
data:{
getMt:function(val){
alert(val)
}
}
}).$mount('#app')
</script>
</body>
</html>