[element-ui] $notify使用自定义组件

$notify，显示全局的通知提醒消息
failOrderTip.vue

<div class="failOrderTip">
        <div class="title">
            <i class="el-icon-message-solid"></i> 通知
        </div>
        <div class="content">
            <span>订单号：</span>
            <span v-for="(item, index) in failOrderData" :key="index">{{ item }} </span>
            <span>发货失败，请及时处理</span>
        </div>
    </div>

引用

import failOrderTip from './components/failOrderTip.vue'

this.$notify({
     // title:'通知',
     dangerouslyUseHTMLString: true,
     message: this.$createElement('failOrderTip', {       // 使用自定义组件
       ref: 'failOrderTip',
       props: {
         data: this.data
       }
     }),
     duration: 0
   })

$notify使用完成之后记得关闭

this.$notify.closeAll()

关闭某个

const instance = this.$notify({
... ...
instance.close()

参考：

vue + element ui之$notify使用自定义组件

element-ui this.$notify使用html作为内容 包括事件 禁止面板重叠 关闭面板