当前位置: 首页 > news >正文

解决微信小程序中camera组件被view事件穿透触发对焦以及camera的bindtap事件

view跟camera组件同级

不要用bind:tapcatch:tap

替换用catch:touchstart即可解决!

如果你不放心,可以再加个透明蒙版,这样就不会触发了!(不加这个也行,但是必须要用catch:touchstart)

  <!-- 相机层(横屏适配) --><camera device-position="back" resolution="high" frame-size="large" style="width: 100%; height: 100vh;z-index:10;" catch:touchstart="cameraClick" id="myCamera"></camera><!-- 在camera组件同级添加 --><view style="{{shieldStyle}}" catch:touchstart="noop"></view><!-- 你的业务view内容 --><view>xxx</view>
  onReady() {// 双重保险:透明拦截层this.createTouchShield();},// 创建透明拦截层createTouchShield() {const query = wx.createSelectorQuery();query.select('#myCamera').boundingClientRect(rect => {console.log(rect)this.setData({shieldStyle: `position:absolute;left:${rect.left}px;top:${rect.top}px;width:${rect.width}px;height:${rect.height}px;z-index:999;pointer-events:auto;`});}).exec();},noop() {}, // 空函数吞噬所有事件
http://www.dtcms.com/a/316623.html

相关文章:

  • 猜数字游戏 Java
  • 并发编程的三要素是什么
  • Docker Desktop
  • 实战项目3-工控软件-2.0- 自定义控件HMILabel的创建
  • 用 Spark 找出最大值:高性能计算的正确姿势
  • 线性筛和os数组(牛客多校25年#7-G)
  • (ZipList入门笔记二)为何ZipList可以实现内存压缩,可以详细介绍一下吗
  • web_socket_channel 后台重连机制失败
  • Kafka 的基本操作(1)
  • Web存储技术详解:sessionStorage、localStorage与Cookie
  • MySQL 深分页优化方案
  • Matplotlib(六)- 坐标轴定制
  • 【motion】HumanML3D 的安装1:环境搭建
  • 制造业ERP系统架构设计方案(基于C#生态)
  • [激光原理与应用-151]:光学器件 - 光学平晶:高精度平面度检测的核心工具
  • 用phpstudy安装php8.2后报错:意思是找不到php_redis.dll拓展时
  • 如何对云环境或者超融合系统进行性能测试?
  • Pandas 入门:数据分析的得力工具
  • PowerBI VS QuickBI 实现图表的动态配色
  • Vue 2 渲染链路剖析
  • Linux逻辑卷管理操作指南
  • Arxiv-Daily
  • AUTOSAR进阶图解==>AUTOSAR_RS_ECUResourceTemplate
  • 【前端】使用jQuery播放图片,类似播放幻灯片一样
  • Redis面试精讲 Day 11:Redis主从复制原理与实践
  • RAG向量检索增强生成
  • MediaPipe框架解析(五):c++ face_mesh解析
  • TDengine 中 TDgpt 的模型评估工具
  • 基于WOA鲸鱼优化的VMD-GRU时间序列预测算法matlab仿真
  • 代码随想录day57图论7