canvas签名页面跟着滑动bug

记录一个花了两天时间才解决的bug,过程非常难受,需求是一个阅读合同的小程序界面,在阅读完成后弹出遮罩层进行签名
问题:在弹出层签名的时候遮罩层下面的合同也在跟着滑动,安卓端没有这个问题,真机调试的ios上就出现了这个问题
试错一:ios上快速的点击并滑动,页面就会跟着滑动,长按一下下再开始滑动,页面就不会滑动,这让我想起以前遇到一个ios端300ms事件延迟的问题,所以我去引入fastclick.js来解决这个300ms延迟问题,然而并没有效果,页面依旧会滑动。
试错二:因为不是上面那个问题,那可能就是事件穿透导致的,但是我阻止事件冒泡,阻止了默认事件,依旧没有用,canvas之外的部分没有这个问题,canvas内绘制签名时下面页面还是会滚动。
试错三:接着我尝试在弹出弹窗时直接将页面隐藏了,没有高度了,结果发现新bug,他还是会上下滚动,而且将页面的下拉刷新都给拉下来了,但是明明就写好了禁止下拉刷新,到这就脑壳爆炸了。
问百度,问ai的解决方法都是调整高度,或者修改样式定位,或者阻止冒泡阻止默认事件,但是都试过了,解决不了问题。
开始盲目寻找官网,uniapp官网中的canvas描述发现了一个属性
尝试的心态写了上去,直接就解决了我的问题,我裂开了。查了那么多居然没有查到一个说加个disable-scroll就能解决的,希望以后踩坑的同学能够看到这篇。

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

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

相关文章

PowerBI怎么修改数据库密码

第一步:点击转换数据 第二步:点击数据源设置 第三步:点击编辑权限 第四步:点击编辑 第五步:输入正要修改的密码就可以了

STM32启动过程及反汇编

STM32从Flash启动的过程,主要是从上电复位到main函数的过程,主要有以下步骤: 1.初始化堆栈指针 SP_initial_sp,初始化 PC 指针Reset_Handler 2.初始化中断向量表 3.配置系统时钟 4.调用 C 库函数_main 初始化用户堆栈&#xf…

SAP HANA中PAL算法使用入门

1 应用场合 SAP HANA作为一款内存数据库产品, 使得数据常驻内存, 物理磁盘的存储作为数据备份与日志记录, 以防断电内存中数据丢失. 这种构架大大的缩短了数据存取的时间, 使得SAP HANA很”高速”. 在传统数据模型中,数据库只是作为存取数据一个工具,对于类似下图所示的应用, 客…

星瑞格数据库管理系统

一. 产品介绍 随着信息化的到来,数据安全成为保障信息化建设的一个关键问题;数据库作为信息化系统的基础软件其自身安全以及对数据的保障是至关重要。现阶段国内重要部门的信息系统存放着大量敏感数据,为了保障其数据的安全性,使用…

11、电源管理入门之Regulator驱动

目录 1. Regulator驱动是什么? 2. Regulator框架介绍 2.1 regulator consumer 2.2 regulator core 2.3 regulator driver 3. DTS配置文件及初始化 4. 运行时调用 5. Consumer API 5.1 Consumer Regulator Access (static & dynamic drivers) 5.2 Regulator Outp…

基于springboot+vue的美食烹饪互动平台

博主主页:猫头鹰源码 博主简介:Java领域优质创作者、CSDN博客专家、阿里云专家博主、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战,欢迎高校老师\讲师\同行交流合作 ​主要内容:毕业设计(Javaweb项目|小程序|Pyt…

Tomcat+Nginx的动静分离

1.反向代理多机 实验:Nginx要开启upstream(负载均衡)、location(url链接)、proxy_pass(反向代理) 配置:7-3做代理服务器;7-1 和 7-2做Tomcat服务器 关闭防火墙和selinux 1.准备配置 7-3安装nginx;7-1 和 7-2安装Tomcat&#xff…

章鱼网络 Community Call #18|Omnity 将首先支持 Runes 协议资产跨链

香港时间2024年2月8日12点,章鱼网络举行第18期 Community Call。 2024年,我们打开一个良好的局面:$NEAR Restaking 已经完成第三方审计,并且经过几次迭代,进入了正式稳定运行的阶段。更重要的是,我们宣布了…

对话框

1.焦点变更监听器 <?xml version"1.0" encoding"utf-8"?> <LinearLayout xmlns:android"http://schemas.android.com/apk/res/android"xmlns:app"http://schemas.android.com/apk/res-auto"xmlns:tools"http://schem…

appium解锁android真机系统的屏幕

在使用appium进行app自动化操作的过程中&#xff0c;经常遇到的第一个难题就是如何解锁系统屏幕&#xff0c;也就是亮屏解锁。 实际上解决办法如下&#xff1a;在desired_capabilities中增加两个参数unlockType和unlockKey&#xff0c;类似的示例代码如下&#xff1a; desire…

【操作系统学习笔记】文件管理1.4

【操作系统学习笔记】文件管理1.4 参考书籍: 王道考研 视频地址: Bilibili I/O 软件层次结构 I/O 请求: 用户 -> 用户层软件 -> 设备独立性软件 -> 设备驱动程序 -> 中断处理程序 -> 硬件 I/O 应答: 硬件 -> 中断处理程序 -> 设备驱动程序 -> 设备独…

一文弄懂回溯算法(例题详解)

目录 什么是回溯算法&#xff1a; 子集问题&#xff1a; 子集问题II(元素可重复但不可复选): 组合问题&#xff1a; 组合问题II(组合总和): 组合问题III(组合总和II): 排列问题&#xff1a; 排列问题II(元素可重复但不可复选): 排列问题III(元素无重复但可复选): 最后…

程序猿怎么选赛道|规划

程序员职业赛道是一个关乎个人兴趣、技能、市场需求以及长期发展规划的重要决策过程。 自我认知与兴趣挖掘 首先&#xff0c;选择职业赛道的核心是明确自身的兴趣所在和擅长之处。前端开发人员往往需要对用户体验有深刻理解&#xff0c;享受将设计变为现实&#xff0c;使用户与…

electron+vue3全家桶+vite项目搭建【29】封装窗口工具类【3】控制窗口定向移动

文章目录 引入实现效果思路声明通用的定位对象主进程模块渲染进程测试效果 引入 demo项目地址 窗口工具类系列文章&#xff1a; 封装窗口工具类【1】雏形 封装窗口工具类【2】窗口组&#xff0c;维护窗口关系 封装窗口工具类【3】控制窗口定向移动 很多时候&#xff0c;我们想…

Qt 运行一个实例进程

QLocalSocket QLocalServer 逻辑&#xff1a;首先一个新的实例启动时&#xff0c;将尝试连接到同一个本地服务器&#xff0c;如果连接失败&#xff0c;则表示第一个实例进程&#xff0c;创建一个本地服务器&#xff1b;否则&#xff0c;拉起已打开的实例进程。 main.cpp #i…

【学习心得】网站运行时间轴(爬虫逆向)

一、网站运行时间轴 掌握网站运行时间轴&#xff0c;有助于我们对“请求参数加密”和“响应数据加密”这两种反爬手段的深入理解。 二、从网站运行的时间轴角度来理解两种反爬手段 1、加载HTML&#xff1a; 这是浏览器访问网站时的第一步&#xff0c;服务器会返回基础…

C#双向链表:只用泛型节点类ListNode<T>设计的最短的双向链表包含初始化链表数据和遍历链表各节点

目录 一、涉及到的知识点&#xff1a; 1.ListNode 类使用自动属性设计 2. 泛型节点类设计的误区 二、仅仅定义泛型节点类&#xff0c;实现最短的双向链表 一、涉及到的知识点&#xff1a; 1.ListNode 类使用自动属性设计 public class ListNode {public object Object { …

javascrip几种基本的设计模式

单例模式 ES5 function Duck1(name:string){this.namenamethis.instancenull }Duck1.prototype.getNamefunction(){console.log(this.name) }Duck1.getInstancefunction(name:string){if(!this.instance){this.instance new Duck1(name)} } const aDuck1.getInstance(a) const…

【系统架构设计师考试大纲】

曾梦想执剑走天涯&#xff0c;我是程序猿【AK】 目录 简述概要知识图谱考试目标考试要求考试题目题型分析计算机基础知识&#xff08;20%&#xff09;信息化战略与规划&#xff08;9%&#xff09;软件工程&#xff08;25%&#xff09;系统架构设计&#xff08;35%&#xff09;信…

Qt在windows编译hiredis依赖库

目录 0 前言1 Qt安装遇到的问题2 hiredis源码下载2.0 redis源码下载2.1 hiredis源码下载2.2 编译hiredis源码2.3 遇到的问题列表参考资料0 前言 当前参与的项目需要用Qt对redis进行操作,以前没玩过这块,顺手记下笔记梳理起来~ 1 Qt安装 安装版本下载:https://download.qt…