vue.extend实现alert模态框弹窗组件

本文通过Vue.extend创建组件构造器的方法写弹窗组件，供大家参考，具体内容如下

alert.js文件代码

import Vue from 'vue'
// 创建组件构造器
const alertHonor = Vue.extend(require('./alert.vue'));

var currentMsg = {callback:function(){
}}

export default function(options){

  var alertComponent = new alertHonor({el: document.createElement('div')});
  alertComponent.title = options.title;
  alertComponent.ranking = options.ranking;
  // 把alertHonor.vue加入body中
  alertComponent.$appendTo(document.body);

  // 回调函数
  alertComponent.callback = function(action) {
    if (action == 'share') {
      options.share();
    }
  };

}

alert.vue代码

 引用页面代码

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。