layer做阻塞式弹出层的方法

news2024/11/17 1:52:26

 

今天遇到一个问题:文章来源地址https://www.yii666.com/article/301050.html?action=onAll

  layer弹出一个confirm提示窗,然后confirm还没有点击对应的按钮的时候,就已经执行了后续代码,我这里做出的判断是,是否需要进行后续操作,但是因为layer.confitm的非阻塞式的特性导致我这个控制失效,无法达到点击确定或者取消的效果。

研究了几个方法,都不怎么样,有些方法是把后续操作全部放到回调函数里面去,但是这个操作影响到我目前的逻辑,对方法的封装也不友好,所以就抛弃了。文章来源地址https://www.yii666.com/article/301050.html?action=onAll

  后面自己谷歌到一个通过async关键字来实现阻塞式弹窗的方法:直接上图文章来源地址:https://www.yii666.com/article/301050.html?action=onAll

首先在你需要阻塞的方法的开始写关键字async,

 

我这里是一个点击事件,所以直接function上加上async关键字。

然后内部需要阻塞执行的方法前面需要加上await关键字,如图:文章来源地址:https://www.yii666.com/article/301050.html?action=onAll

这样就可以让代码停在这个方法,需要注意的是,我这里的MrIsLocked()这个方法,在写方法具体逻辑的时候,也需要加async关键字,https://www.yii666.com/

也就是声明方法的时候,如图:

  简单的来说,就是在弹窗的方法声明时候加上async关键字,调用该方法的时候加上await关键字,就可以达到这个效果了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/712802.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

vue新特性

vue3 ref、reactive toRefs setup ref reactive 实现了数据响应式,不能使用 ES6 解构,会消除响应特性。所以需要 toRefs 解构,使用时,需要先引入。 let me reactive({single:true,want:"暖的像火炉的暖男" }) //运…

小黑收到阿黄宴请潮汕牛肉火锅,跟淹哥包鹏拉面,明日飞新疆乌鲁木齐地窝堡的leetcode之旅:剑指 Offer II 016. 不含重复字符的最长子字符串

小黑代码&#xff08;与官方题解思路一致&#xff09; class Solution:def lengthOfLongestSubstring(self, s: str) -> int:# 字符串长度n len(s)# 定义双指针head 0tail 0# 窗口集合set_ set()# 结果变量result 0while tail < n:# 该字符不在集合里if s[tail] no…

【数据结构】队列——顺序实现+链式实现(带头结点+不带头结点)入队 出队 初始化 判空 双端队列 完整代码

文章目录 四 队列1.基本概念2.队列的顺序存储3.队列的链式实现3.1 定义3.2 带头结点3.2.1 初始化3.2.2 判空3.2.3 入队3.2.4 出队3.2.5 完整代码 3.3 不带头结点3.3.1 初始化3.3.2 入队3.3.3 出队3.3.4 完整代码 4.双端队列 四 队列 1.基本概念 定义 只允许在一端进行插入&…

代理服务器拒绝连接怎么办

在使用代理服务器时&#xff0c;有时我们可能会遇到代理服务器拒绝连接的问题。这种情况可能会阻止我们访问被封锁的内容或绕过地理限制。下面&#xff0c;我们来一起探讨一下。 1. 配置错误 代理服务器拒绝连接的一个常见原因是配置错误。请确保您已正确输入代理服务器的地址和…

64MHz 闪存STM32G0B1CEU6(STM32G0B1CCU6)STM32G0B1CBU6引脚配置图、32位微控制器

STM32G0B1 32位微控制器具有最高512KB嵌入式闪存和144kB RAM存储器。该器件采用48-UFQFPN 引脚封装。它支持USB全速主机/设备、集成USB Type-C控制器和收发器、FDCAN协议以及多达8个UART。 STM32G0 32位微控制器 (MCU) 适合用于消费、工业和家电领域的应用&#xff0c;并可随时…

el-carousel和el-image组合实现swiper左右滑动图片,点击某张图片放大预览的效果

<template><el-carousel class"image-swiper" :height"100%" :indicator-position"swiperItems.length < 1 ? none : ":arrow"swiperItems.length < 1 ? never : "><el-carousel-item v-for"(a, $i) in s…

尚硅谷Docker实战教程-笔记06【Docker容器数据卷】

尚硅谷大数据技术-教程-学习路线-笔记汇总表【课程资料下载】视频地址&#xff1a;尚硅谷Docker实战教程&#xff08;docker教程天花板&#xff09;_哔哩哔哩_bilibili 尚硅谷Docker实战教程-笔记01【理念简介、官网介绍、平台入门图解、平台架构图解】尚硅谷Docker实战教程-笔…

移动端H5实现自定义拍照界面

一、实现思路 手机端 H5 实现自定义拍照界面也可以使用 MediaDevices API 和 <video> 标签来实现。 首先&#xff0c;使用 MediaDevices.getUserMedia() 方法获取摄像头媒体流&#xff0c;并将其传递给 <video> 标签进行渲染。 接着&#xff0c;使用 HTML 的 <…

手把手教你搭建SpringCloudAlibaba之Sentinel注解SentinelResource

SpringCloud Alibaba全集文章目录&#xff1a; 零、手把手教你搭建SpringCloudAlibaba项目 一、手把手教你搭建SpringCloud Alibaba之生产者与消费者 二、手把手教你搭建SpringCloudAlibaba之Nacos服务注册中心 三、手把手教你搭建SpringCloudAlibaba之Nacos服务配置中心 …

【智慧交通项目实战】《 OCR车牌检测与识别》(四):基于Pyqt的项目可视化

&#x1f468;‍&#x1f4bb;作者简介&#xff1a; CSDN、阿里云人工智能领域博客专家&#xff0c;新星计划计算机视觉导师&#xff0c;百度飞桨PPDE&#xff0c;专注大数据与AI知识分享。✨公众号&#xff1a;GoAI的学习小屋 &#xff0c;免费分享书籍、简历、导图等&#xf…

SpringBoot 限流方案

一、背景 限流对于一个微服务架构系统来说具有非常重要的意义&#xff0c;否则其中的某个微服务将成为整个系统隐藏的雪崩因素&#xff0c;为什么这么说&#xff1f; 举例来讲&#xff0c;某个SAAS平台有100多个微服务应用&#xff0c;但是作为底层的某个或某几个应用来说&…

【前端】运行一个vue项目

如何运行一个vue项目 首先cd到要运行的vue文件夹下&#xff0c;或者是在webstorm下面的终端直接打开&#xff0c;就会自动开启在这个文件夹下的终端安装项目中所有需要的依赖包 sudo npm install运行项目 sudo npm run serve到这里项目就运行起来了 4. 打开项目 点击网址打…

html实现视频网站,仿爱奇艺,搜狐,迅雷看看(附源码)

文章目录 1.功能模板1.1 仿爱奇艺1.2 仿搜狐视频1.3 仿迅雷看看1.4 视频播放1.5 影视公司官网 2.效果和源码2.1 源代码2.2 模板目录 源码下载 作者&#xff1a;xcLeigh 文章地址&#xff1a;https://blog.csdn.net/weixin_43151418/article/details/131516313 html实现视频网站…

c++ 内存管理二:重载(接管内存管理工具)

文章目录 前言1 重载全局的 ::operator new 运算符2 重载类的 operator new 运算符3 重载类的带有额外参数的 operator new 运算符 前言 重载 operator new 运算符来自定义内存分配的行为。重载 operator new 运算符允许我们使用自定义的内存分配逻辑&#xff0c;例如使用池分…

压测工具哪个好?LoadRunner、Jmeter、Locust、Wrk 全方位对比....

当你想做性能测试的时候&#xff0c;你会选择什么样的测试工具呢&#xff1f;是会选择wrk&#xff1f;jmeter&#xff1f;locust&#xff1f;还是loadrunner呢&#xff1f;今天&#xff0c;笔者将根据自己使用经验&#xff0c;针对jmeter、locust、wrk和loadrunner常用的性能测…

【数据结构与算法】内排序算法比较(C\C++)

实践要求 1. 问题描述 各种内部排序算法的时间复杂度分析结果只给出了算法执行时间的阶&#xff0c;或大概执行时间&#xff0c;试通过随机的数据比较各算法的关键字比较次数和关键字移动次数&#xff0c;以取得直观感受。 2. 基本要求 对以下10种常用的内部排序算法进行比较…

MySQL更改表结构语句

一、MySQL表结构变更语句 1. 新增字段 语法&#xff1a; &#xff08;1&#xff09;在末尾添加字段 ALTER TABLE <表名> ADD <新字段名><数据类型>[约束条件]; &#xff08;2&#xff09;在开头添加字段 ALTER TABLE <表名> ADD <新字段名> <…

[C++]lambda

目录 前言&#xff1a; 1 认识lambda 2 lambda语法 3 lambda的类型 4 lambda的底层 前言&#xff1a; 本篇讲解了C11当中新添加的lambda语法&#xff0c;以及lambda的底层 1 认识lambda lambda的出现方便了很多我们写程序的地方&#xff0c;例如下面这个样例…

C++图形开发(2):最基本的图形界面

文章目录 1.构成2.内容介绍2.1 initgraph()2.2 _getch()2.3 closegraph() 3.总结 今天来简单介绍下最基本的图形界面~ 1.构成 输入以下内容并编译&#xff1a; 这就是一个最基本的图形界面了 #include<graphics.h> #include<conio.h>int main() {initgraph(600, …

rollup入门 - 学习笔记(1)

rollup打包工具 打包项目用webpack , 打包js库用rollup 下载rollup npm i rollup --save-dve 初始化项目 npm init -y 创建src/main.js文件 import welcomerollup from ../modules/mymodule welcomerollup(hello world) 创建module/mymodule.js文件 const welcomerollup (ms…