vue插件--仿微信小程序showModel实现模态提示窗功能
效果图:
下面是源码:
index.js
importVuefrom'vue'; importmodelfrom'./model.vue'; exportdefault{ install(Vue){ constdefaults={ show:false, mask:true, title:'提示', content:'这是正文', confirmButton:true, cancelButton:true, confirmText:'确认', cancelText:'取消', cancelCallBack:()=>{}, confirmCallBack:()=>{} }; constmodelVueConstructor=Vue.extend(model); Vue.prototype.$model=(options={})=>{ if(Vue.prototype.$isServer)return; options=Object.assign({},defaults,options); letparent=document.body; letinstance=newmodelVueConstructor({ el:document.createElement('div'), data:options }); parent.appendChild(instance.$el); returninstance; }; }, };
model.vue
{{title}}