1:语法
vue提供install可供我们开发新的插件及全局注册组件等
install方法第一个参数是vue的构造器,第二个参数是可选的选项对象
| export default { |
| install(Vue,option){ |
| 组件 |
| 指令 |
| 混入 |
| 挂载vue原型 |
| } |
| } |
复制
2:注册组件
一:注册单个组件
1:全局自定义指令
| export default{ |
| install(Vue){ |
| Vue.directive('pre',{ |
| inserted(button,bind){ |
| button.addEventListener('click',()=>{ |
| if(!button.disabled){ |
| button.disabled = true; |
| setTimeout(()=>{ |
| button.disabled = false |
| },1000) |
| } |
| }) |
| } |
| }) |
| } |
| } |
复制
2:在main.js跟注册组件一样
| import pre from '@/aiqi'; |
| |
| Vue.use(pre); |
复制
二:注册多个组件
1:在install()方法中挂载组件
| |
| import update from './update/index.vue'; |
| import ImageUpload from './ImageUpload/ImageUpload.vue'; |
| import ScreenFull from './ScreenFull'; |
| import ThemePicker from './ThemePicker'; |
| import TagsView from './TagsView'; |
| export default { |
| install(Vue) { |
| Vue.component('update', update); |
| Vue.component('ImageUpload', ImageUpload); |
| Vue.component('ScreenFull', ScreenFull); |
| Vue.component('ThemePicker', ThemePicker); |
| Vue.component('TagsView', TagsView); |
| } |
| } |
复制
2:在main.js中直接用引用并Vue.use进行注册
| import Component from '@/components'; |
| Vue.use(Component); |
复制