vue通用提示组件

528 阅读1分钟

main.js

import common from './util/common.js';
Vue.use(common);

common.js

import xx from 'xx.vue' 组件
export default {
    install(Vue, options) {
        Vue.prototype.$toast2 = function(params) { 
           let data = {};
           typeof params === 'string' ?
           data = {
               title: params,
               content: '',
           } : data = {
               title: '',
               content: '',
               ...params
           }
           // data内选项为参数
           let d = document.querySelector('.toast2'); // 添加一个页面元素
           if (!d) {
               d = document.createElement('div');
               d.className = 'toast2';
               document.body.appendChild(d);
           }
           if (!Vue.toast2Vm) {
               Vue.toast2Vm = new Vue(toast);
               Vue.toast2Vm.$mount(d);
           }
           data.show = true;
           Object.keys(data).forEach(k => {
               Vue.toast2Vm[k] = data[k];
           })
       }
       Vue.prototype.$cloToast2 = function () {
           if (Vue.toast2Vm) {
               Vue.toast2Vm.show = false;
           }
       }
    }
}

vue,html 按正常里面些就好,写在data 里面