vue实现复用组件，无限弹窗，内嵌组件交互

一：场景

部分产品的实现中，我们可能遇到这样一个问题，就是组件的复用，类似于一个elementui的notify，它不需要在你的页面上写他的组件名称，只需要使用它的全局的方法，如：this.$notify("")这样的方式调出弹窗，但是目前我们所遇见的组件只能向里面嵌入文字或者网页，那么我们如何实现向我们弹出层中嵌入组件。

二：解决方案

为了避免在文件中大量的嵌入弹出层组件的tag标签，我们选择vue.extend的方案动态的创建组件以此解决问题

三：需要解决的问题

  1：使用extend的方案动态插入的组件我们无法使用国际化以及路由等插件，需要我们手动注入

  2:  组件中出现子父组件通讯如何解决。 实际上vue之间的子父组件的通讯是由事件驱动来完成的，他们存储在组件实例的_events中 格式为{name: [方法1，方法2]}，类似于发布订阅的事件驱动的存储方式

  3:  组件中存在插槽的情况下怎么解决。组件实例.$slots.default中存储的便是我们的插槽，里面可以存放其他组件或者普通的网页模板，default为默认的slot，更换default为其他值则为具名插槽 

解决以上问题就基本完成组件的动态插入

四：插件的使用

  1:  下载插件 

npm i vue-dynamic-plugin

  2:  使用插件

import {Dynamic} from vue-dynamic-plugin

// plugin =>注入项目中实际使用的插件

Vue.use(Dynamic, {plugin: {

router,

store,

i18n

}})

this.$dynamic（dom, ComponentsView, data, emit, slots）：promise返回的为promise

具体文档在包中的readme