uniapp的app项目,添加全局弹窗

项目需求:需要每隔半个小时,获取硬件的电量,如果电量低于20%,弹窗提示。

在APP.vue中增加了mixins,在mixins中实现每隔半小时获取电量的工作。

但是全局弹窗怎么做,之前确实不清楚。

1、刚开始想着直接在APP.vue中定义弹窗,或者组件引入,但是发现app.vue中定义弹窗不行。

2、后来又想直接去插件市场找个插件,刚开始找了如下的,在h5可以运行,但是app可能是我写的不对,有点问题。

3、后来去uniapp官网,直接搜索全局弹窗,找到了一个,点击进去,她有例子,点击例子链接

其中对应的例子,就是

可以下载参考,它是直接把弹窗配置到了package.json中,然后在对应的地方跳转,

跳转到的弹窗页面,注意设置背景page {

background: transparent;

}

至此,就实现了全局弹窗,再次总结:

1、在app.vue中定义mixins,将需要的公共操作放进来。

2、将弹窗定义到package.json中,具体配置如下

3、在对应的需要弹窗的地方,设置事件,用跳转的方式显示弹窗

4、在弹窗的页面,设置背景样式

相关推荐
2501_916008899 小时前
深入解析iOS机审4.3原理与混淆实战方法
android·java·开发语言·ios·小程序·uni-app·iphone
QT.qtqtqtqtqt10 小时前
uni-app小程序前端开发笔记(更新中)
前端·笔记·小程序·uni-app
喵喵虫20 小时前
uniapp修改封装组件失败 styleIsolation
uni-app
游戏开发爱好者81 天前
日常开发与测试的 App 测试方法、查看设备状态、实时日志、应用数据
android·ios·小程序·https·uni-app·iphone·webview
2501_915106321 天前
app 上架过程,安装包准备、证书与描述文件管理、安装测试、上传
android·ios·小程序·https·uni-app·iphone·webview
2501_915106321 天前
使用 Sniffmaster TCP 抓包和 Wireshark 网络分析
网络协议·tcp/ip·ios·小程序·uni-app·wireshark·iphone
宠友信息1 天前
2025社交+IM及时通讯社区APP仿小红书小程序
java·spring boot·小程序·uni-app·web app
“负拾捌”1 天前
python + uniapp 结合腾讯云实现实时语音识别功能(WebSocket)
python·websocket·微信小程序·uni-app·大模型·腾讯云·语音识别
局外人LZ2 天前
Uniapp脚手架项目搭建,uniapp+vue3+uView pro+vite+pinia+sass
前端·uni-app·sass
2501_915918412 天前
在 iOS 环境下查看 App 详细信息与文件目录
android·ios·小程序·https·uni-app·iphone·webview