VUE手动实现一个编程式组件

####1.创建一个组件（用于编程式调用的) ```

{{message}}

``` ####2.实现编程式 ``` import Toast from './toast' const obj = {} obj.install = function (Vue) { // 创建构造器 const ToastContrystor = Vue.extend(Toast) // new的方式 根据组件构造器，可以创建组件对象 const toast = new ToastContrystor() // 手动挂载某一个元素上 toast.$mount(document.createElement('div')) // toast.$el对应的就是div document.body.appendChild(toast.$el) //组件挂载到Vue原型上 Vue.prototype.$toast = toast } export default obj ``` ####3.在main.js注册 ``` import Vue from 'vue' import toast from '@/components/common/toast/index.js' Vue.use(toast) ``` ####4.使用 ``` this.$toast.show('这不是一个错误',1000) ```