使用uni-app设置全局页面适用于模态框

使用uni-app设置全局页面适用于模态框,只要调用就可以实现

文章目录

  • 使用uni-app设置全局页面适用于模态框,只要调用就可以实现
  • 前言
  • 一、首先我们要先创建一个弹框的页面
  • 二、然后在main.js里面调用(设置全局)
    • 2.进入弹框详情页
    • 3.在页面调用
  • 总结


前言

弹框完整代码链接

在做uni-app移动端H5要实现一个弹框,效果需要在不管用户单击那个页面都会出现弹框,除非用户点击弹框进入详情查看点击确定后,就不会出现弹框了
效果图:
使用uni-app设置全局页面适用于模态框_第1张图片


一、首先我们要先创建一个弹框的页面

我是在项目里的common下面的Dialogs.vue写的
使用uni-app设置全局页面适用于模态框_第2张图片

使用uni-app设置全局页面适用于模态框_第3张图片

二、然后在main.js里面调用(设置全局)

使用uni-app设置全局页面适用于模态框_第4张图片这样就可以成功设置全局了

2.进入弹框详情页

//通过接口点击后is_confirm 0 弹框 1不弹
使用uni-app设置全局页面适用于模态框_第5张图片

3.在页面调用


如果你在底部table切换使用那就在页面加Dia-logs标签就可以了 ,注意:【其实在别的页面也可以调用只不过需要刷新才可以出现弹框,不过要是指定几个页面加上Dia-logs标签就不存在这个问题了】使用uni-app设置全局页面适用于模态框_第6张图片

总结

这里对文章进行总结:
以上就是今天要讲的内容,本文仅仅简单介绍了设置全局的使用,如果你要设置全局可以参考一下本文,希望对您有所帮助

你可能感兴趣的:(uni-app,vue.js,html5,html)