当前位置：网站首页 > 技术分类 > 正文

Vue-实现自定义插件弹窗（vue 实现弹窗）

ztj100 2024-10-27 18:35 538 浏览 0 评论

实现自定义组件在 main文件不是以标签的形式存在，而是通过调用方法触发业务

效果：

1、插件入口实现，在main文件中会根据使用vue.use()引入插件模版文件

2、在组件的javascript中定义入口配置

（1）实现 install 方法，在 vue中use后会默认执行 install方法

（2）挂载模版组件到body，渲染组件

（3）执行事件触发，在这其中定义了两个 confirm 、alert 两个方法（不同效果）

（4）根据需求处理业务

3、在组件模版 iAlert.vue 中，实现业务逻辑效果

4、根据情况，调用方法触发业务

效果1:

this.$iAlert.confirm({

content : '确认执行该操作?',

title: '提示',

options: {

success: (rs)=>{

Console.log('成功回调')

})

}

}})

效果2:

this.$iAlert.alert({content : '已点击取消！',title: '提示'})

vue dispatch

上一篇：【React与Vue】如何在页签中监听 LocalStorage 变化?这些方法你都
下一篇：Vue实战082:el-upload实现图片手动上传及预览

Vue-实现自定义插件弹窗（vue 实现弹窗）

相关推荐

取消回复欢迎你发表评论:

Vue自定义Hook示例:useUrlState（vue中的自定义指令如何使用）

Vue-实现自定义插件弹窗（vue 实现弹窗）

旗舰机新标杆 OPPO Find X2系列正式发布售价5499元起

什么是幂等?分布式锁如何实现业务幂等?

【Python机器学习系列】建立多层感知机模型预测心脏疾病

如何发个 npm 包?

详解MySQL 字符串拼接之concat\concat_ws\group_concat

手把手教你搞定菜单权限设计，精确到按钮级别，建议收藏

如何快速切换node版本?利用n包快速切换nodejs版本

让Jenkins自动部署你的Vue项目「实践」

Vue-实现自定义插件弹窗（vue 实现弹窗）

相关推荐

取消回复欢迎 你 发表评论:

Vue自定义Hook示例:useUrlState（vue中的自定义指令如何使用）

Vue-实现自定义插件弹窗（vue 实现弹窗）

旗舰机新标杆 OPPO Find X2系列正式发布 售价5499元起

什么是幂等?分布式锁如何实现业务幂等?

【Python机器学习系列】建立多层感知机模型预测心脏疾病

如何发个 npm 包?

详解MySQL 字符串拼接之concat\concat_ws\group_concat

手把手教你搞定菜单权限设计，精确到按钮级别，建议收藏

如何快速切换node版本?利用n包快速切换nodejs版本

让Jenkins自动部署你的Vue项目「实践」

取消回复欢迎你发表评论:

旗舰机新标杆 OPPO Find X2系列正式发布售价5499元起