uniapp弹出框_uni-app自定义Modal弹窗组件|仿ios、微信弹窗效果

本文介绍了基于uni-app开发的uniPop组件,用于创建自定义模态弹窗、msg信息框、alert对话框、confirm确认框和toast弱提示框。支持多种动画效果、自定义样式和按钮事件,同时兼容H5、小程序和App端。
摘要由CSDN通过智能技术生成

介绍

uniapp自定义弹窗组件uniPop,基于uni-app开发的自定义模态弹窗|msg信息框|alert对话框|confirm确认框|toast弱提示框

支持多种动画效果、多弹窗类型ios/android、可以自定义弹窗样式/自定义多按钮及事件/弹窗显示位置、自动关闭秒数、遮罩层透明度及点击遮罩是否关闭

H5/小程序/App三端效果如下,亲测多端效果兼容性一致。(后续大图均展示App端)

用法

◆弹窗uniPop.vue组件两种引入方式

1、在main.js里引入全局组件

import uniPop from './components/uniPop/uniPop.vue'

Vue.component('uni-pop', uniPop)

2、在相应页面引入组件

import uniPop from './components/uniPop/uniPop.vue'exportdefault{

data() {return{

...

}

},

components:{

uniPop

},

...

}

...

msg信息框效果

 

this.$refs.uniPop.show({

content:'msg消息提示框(5s后窗口关闭)',

shade:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值