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、在弹窗的页面,设置背景样式

相关推荐
七夜zippoe7 小时前
uniapp跳转页面时如何带对象参数
uni-app·携带参数
racerun7 小时前
UniApp中的pages.json 和 tabBar
uni-app·json
米粒宝的爸爸1 天前
uniapp在app端,在导航栏设置自定义按钮
uni-app
dssxyz1 天前
uniapp打包微信小程序主包过大问题_uniapp 微信小程序时主包太大和vendor.js过大
javascript·微信小程序·uni-app
xw51 天前
我犯了错,我于是为我的uni-app项目引入环境标志
前端·uni-app
!win !1 天前
被老板怼后,我为uni-app项目引入环境标志
前端·小程序·uni-app
颜渊呐2 天前
uniapp中APPwebview与网页的双向通信
前端·uni-app
白杨木影子被拉长2 天前
多状态映射不同样式(scss语法)
vue.js·uni-app
一念杂记2 天前
免费开源!微信小程序商城源码,快速搭建你的线上商城系统!
微信小程序·uni-app