uniapp的扩展组件uni-popup 弹出层自动打开

news/2025/1/18 11:35:05/

我的需求是在页面加载完之后自动打开弹窗,自动打开只能写在onReady 或 mounted 生命周期内,这是这个组件的规定:

  • 如果想在页面渲染完毕后就打开 uni-popup ,请在 onReady 或 mounted 生命周期内调用,确保组件渲染完毕,

但我需要在onShow()生命周期函数内判断用户是否已登录,已登录之后再去让弹窗自动打开,直接写在已登录后面会提示报错,弹窗打不开,打不开的原因是此时页面还未加载完,那么页面加载完之后再去执行弹窗打开语句就可以了,用一次性定时器加一点延迟,在定时器里面再执行弹窗打开的方法就不会报错了,我设了5毫秒之后,弹窗出现的效果也看不出多大区别。主要代码如下:

<!--订阅消息弹窗-->
<uni-popup ref="popupdingyue" type="center" :animation="false" :mask-click="false" mask-background-color="rgba(0,0,0,0.6)"><view class="tcbox">我是弹窗</view>
</uni-popup>
<!-- 弹窗结束位置 -->onShow(){let that=this//判断用户是否登录let loginphone= uni.getStorageSync('loginphone');console.log("首页从缓存读取的loginphone",loginphone)if(!loginphone){console.log("loginphone为空跳到登录页面")uni.redirectTo({url:"../login/login",})}else{setTimeout(function(){that.$refs.popupdingyue.open() //打开提示弹窗},5) //5毫秒之后执行这个方法,只执行一次}},


http://www.ppmy.cn/news/1365121.html

相关文章

【一】【计算机网络】win基本命令

检查自己的信息 以太网IPv4 地址就是本地计算机。 以太网适配器 VMware Network Adapter VMnet1的IPv4 地址不是本地计算机。局域网内其他的计算机。 C:\Users\205>ipconfigWindows IP 配置以太网适配器 以太网:连接特定的 DNS 后缀 . . . . . . . :本地链接 IPv6 地址. .…

day02_前后端环境搭建(前端工程搭建,登录功能说明,后端项目搭建)

文章目录 1. 软件开发介绍1.1 软件开发流程1.2 角色分工1.3 软件环境1.4 系统的分类 2. 尚品甄选项目介绍2.1 电商基本概念2.1.1 电商简介2.1.2 电商模式B2BB2CB2B2CC2BC2CO2O 2.2 业务功能介绍2.3 系统架构介绍2.4 前后端分离开发 3. 前端工程搭建3.1 Element-Admin简介3.2 El…

目标跟踪之KCF详解

High-Speed Tracking with Kernelized Correlation Filters 使用内核化相关滤波器进行高速跟踪 大多数现代跟踪器的核心组件是判别分类器&#xff0c;其任务是区分目标和周围环境。为了应对自然图像变化&#xff0c;此分类器通常使用平移和缩放的样本补丁进行训练。此类样本集…

Eureka服务搭建

1️⃣搭建服务 引入依赖 <dependency><groupId>org.springframework.cloud</groupId><artifactId>spring-cloud-starter-netflix-eureka-server</artifactId></dependency>启动类加注解 EnableEurekaServer SpringBootApplication public…

【从零开始学习重要知识点 | 第一篇】快速了解什么是幂等性以及常见解决方案

前言&#xff1a; 当我们在设计和实现分布式系统时&#xff0c;幂等性是一个非常重要的概念。幂等性可以简单地理解为&#xff1a;对于同一操作&#xff0c;不论执行多少次&#xff0c;产生的影响都是相同的。这个概念在分布式系统中非常重要&#xff0c;因为在这种环境下&…

【机器人最短路径规划问题(栅格地图)】基于蚁群算法求解

基于蚁群算法求解机器人最短路径规划问题的仿真结果 仿真结果 收敛曲线变化趋势 蚁群算法求解最优解的机器人运动路径 各代蚂蚁求解机器人最短路径的运动轨迹

利用Spring Boot实现MQTT在物联网中的应用

在物联网&#xff08;IoT&#xff09;领域&#xff0c;消息队列遵循发布/订阅模型的MQTT&#xff08;Message Queuing Telemetry Transport&#xff09;协议变得越来越受欢迎。本文将深入探讨如何在Spring Boot中使用MQTT&#xff0c;并讨论其与其他中间件的集成以及在物联网中…

【vue】vue 是怎么把 template 模版编译成 render 函数的,什么是AST抽象语法树

什么是AST 抽象语法树 是一个对象/或者json是一个数据结构 AST通常是由多个节点组成的树状结构&#xff0c;每个节点代表一个语法单位或表达式。节点之间的关系通过父子关系或兄弟关系来表示程序的结构。在不同的编程语言和工具中&#xff0c;AST可能有不同的表示方式和节点类…