Vue插件使用方法详情分享

export default {
    install(Vue) {
        
        // 自定义全局过滤器（截取前四位A）
        Vue.filter('mySlice', function(){
            return value.slice(0, 4)
        })
        
        // 自定义全局指令（绑定时获取焦点）
        Vue.directive('fbind', {
            bind(element, binding) {element.value = binding.value}
            inserted(element, binding) {element.focus()}
            update(element, binding) {element.value = binding.value}
        })
        
        // 定义混入
        Vue.mixin({
            x: 123,
            y: 456
        })
        
        // 给Vue原型上添加一个方法
        Vue.prototype.hello = ()=>{alert('hello')}
    }
}

import Vue from 'vue'
import App from './App.vue'

Vue.config.productionTip = false

// 引入js插件 ----------------------------
import myplugin from './plugins/myplugin'
Vue.use(myplugin)
// --------------------------------------

new Vue({
  render: h => h(App),
}).$mount('#app')

import Vue from 'vue'
import App from './App.vue'

Vue.config.productionTip = false

// 引入 elementUI 插件 -------------------------
import Elementui from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(Elementui)
// --------------------------------------------

new Vue({
  render: h => h(App),
}).$mount('#app')