vue 自定义组件的方法(两种之一)

定义一直类似于elementui的全局组件, Vue.user()后,页面哪里用到就在哪里插件写;

先上依据:

Vue.use( plugin )

• 参数：

  • {Object | Function} plugin

• 用法：

  安装 Vue.js 插件。如果插件是一个对象，必须提供 install 方法。如果插件是一个函数，它会被作为 install 方法。install 方法调用时，会将 Vue 作为参数传入。

  该方法需要在调用 new Vue() 之前被调用。

  当 install 方法被同一个插件多次调用，插件将只会被安装一次。

• 参考：插件

 

 

   (1)写好vue组件模板, (2)然后在其js文件里定义一个对象, 对象上必须要有方法install(){Vue.component(组件模板)},(3)在main.js里Vue.use(这个对象)

        

      步骤: 在components文件夹下新建一个文件夹toast,里面建两个文件index.js和toast.vue

           toast.vue的代码如下

  

  1 
 14 
 15 
 50 
 51 

index.js代码如下:

1 import ToastCom from './Toast.vue'
2 
3 const Toast={
4     install:function (Vue) {
5         Vue.component('Toast',ToastCom) //注册全局组件
6     }
7 }
8 export default Toast

主文件main.js里引入

            1 import Toast from './components/Toast'//自定义的提示框

       2 Vue.use(Toast) 

应用: