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

uniapp编写微信小程序遇到的坑总结

1、阻止事件冒泡

使用uniapp开发微信小程序的时候,发现使用@click.stop来阻止事件冒泡没有作用,点击了之后发现仍然会触发父组件或者祖先组件的事件。
在这里插入图片描述
在网上查阅,发现使用@tap.stop才能阻止事件冒泡。
在这里插入图片描述

2、二维码生成

在网上找了很多,发现很多都不行(也有可能是代码没写对),最后是在uniapp的插件市场下载uQRcode插件,根据给出的案例,才完美解决了。
下面给处教程:
插件下载地址: uqrcode

1、 选中全部,搜索 “uqrcode”
在这里插入图片描述
2、选中如下插件

如果不是选中的同一个插件,点进入之后可以根据里面的教程案例编写代码,我将已这个插件为案例
在这里插入图片描述
3、下载压缩包

下载压缩包,解压后找到uqrcode.js文件,根据自己项目,复制到项目下。(我的是放在src/utils下的)
在这里插入图片描述

4、使用uqrcode.js

<template><view >	<view ><canvas id="qrcode" ref="qrcode" canvas-id="qrcode":style="{width:`${qrcodeSize}px`, height: `${qrcodeSize}px`}"></canvas></view>	</view>
</template><script>import uQRCode from "@/utils/uqrcode.js"export default {data() {return {qrcodeSize: 160,text:'eoruw20230528'}},mounted(){this.getQRcodeHandle()},methods: {// 获取二维码getQRcodeHandle() {uni.showLoading({title: '二维码生成中',mask: true})uQRCode.make({canvasId: 'qrcode',text: this.text,//二维码内容size: this.qrcodeSize,margin: 10,success: res => {console.log('qrcodeSrc = ' + res);},complete: () => {uni.hideLoading()}})},},}
</script>

相关文章:

uniapp编写微信小程序遇到的坑总结

1、阻止事件冒泡 使用uniapp开发微信小程序的时候&#xff0c;发现使用click.stop来阻止事件冒泡没有作用&#xff0c;点击了之后发现仍然会触发父组件或者祖先组件的事件。 在网上查阅&#xff0c;发现使用tap.stop才能阻止事件冒泡。 2、二维码生成 在网上找了很多&…...

Binary operator ‘*‘ cannot be applied to two ‘Double?‘ operands

在 swift 中声明 Double 类型参数变量在进行运算处理时抛出了如下异常 Binary operator * cannot be applied to two Double? operands 情况一 参数类型不匹配,需将参数类型进行匹配 self.max height / (length * width) // 初始 self.max height / (length * Double(wid…...

C#如何打包EXE程序生成setup安装文件

项目结束之后&#xff0c;有需要将winForm程序打包成.exe文件提供给用户。 这里记录一下打包过程。 1&#xff1a;首先获取打包插件&#xff0c;如果你的VS已经安装&#xff0c;忽略此步骤。 点击 工具->扩展和更新&#xff0c;选择联机&#xff0c;搜索installer&#x…...

【python实现向日葵控制软件功能】手机远程控制电脑

大家好&#xff0c;我是csdn的博主&#xff1a;lqj_本人 这是我的个人博客主页&#xff1a; lqj_本人_python人工智能视觉&#xff08;opencv&#xff09;从入门到实战,前端,微信小程序-CSDN博客 最新的uniapp毕业设计专栏也放在下方了&#xff1a; https://blog.csdn.net/lbcy…...

手机系统录屏怎么录?有什么其他录制方法和注意事项?

手机系统录屏是一种很方便的方式&#xff0c;可以用于录制游戏、教程视频&#xff0c;或者是跟别人分享一些操作。在不同的手机系统中&#xff0c;录制方法可能会有所不同&#xff0c;以下是一些通用的步骤分享以及其他录制工具的分享&#xff0c;有需要的小伙伴们快来看一看吧…...

记录一个编译TubeTK时的报错:at_check问题

在使用如下命令安装TubeTK的cuda_nms时&#xff0c;报了一个错误&#xff0c;记录一下这个错误和解决办法 (base) redmeryredmery:~/Desktop/MOT/TubeTK/post_processing/nms$ python setup.py build_ext --inplace因为这个命令是在/home/redmery/Desktop/MOT/TubeTK/install/…...

k8s v1.27.4二进制部署记录

记录二进制部署过程 #!/bin/bash#升级内核 update_kernel() {rpm --import https://www.elrepo.org/RPM-GPG-KEY-elrepo.orgyum -y install https://www.elrepo.org/elrepo-release-7.el7.elrepo.noarch.rpmyum --disablerepo"*" --enablerepo"elrepo-kernel&q…...

C# API 文档注释规范

C# API 文档注释规范 1. 命名空间注释(namespace)2. summary3. remarks and para4. param5. returns6. example and code7. exception8. typeparam 最近在开发工作中需要实现 API 帮助文档&#xff0c;如果根据所写的代码直接重写 API 帮助文档将会是意见非常大的工作量&#x…...

分类预测 | Matlab实现基于TSOA-CNN-GRU-Attention的数据分类预测

分类预测 | Matlab实现基于TSOA-CNN-GRU-Attention的数据分类预测 目录 分类预测 | Matlab实现基于TSOA-CNN-GRU-Attention的数据分类预测效果一览基本介绍研究内容程序设计参考资料 效果一览 基本介绍 Matlab实现分类预测 | Matlab实现基于TSOA-CNN-GRU-Attention的数据分类预…...

《深度剖析K8s》学习笔记

一、容器技术 1.从进程说起 a. 概述 进程&#xff1a;数据和状态的综合 容器技术的核心&#xff1a;约束和修改进程的动态表现&#xff0c;创造出边界&#xff08;Cgroup&#xff1a;约束/namespace&#xff1a;进程视图&#xff09; 启动容器例子&#xff1a; docker ru…...

神经网络基础-神经网络补充概念-49-adam优化算法

概念 Adam&#xff08;Adaptive Moment Estimation&#xff09;是一种优化算法&#xff0c;结合了动量梯度下降法和RMSProp的优点&#xff0c;用于在训练神经网络等深度学习模型时自适应地调整学习率。Adam算法在深度学习中广泛应用&#xff0c;通常能够加速收敛并提高模型性能…...

Java:正则表达式书写规则及相关案例:检验QQ号码,校验手机号码,邮箱格式,当前时间

正则表达式 目标:体验一下使用正则表达式来校验数据格式的合法性。需求:校验QQ号码是否正确&#xff0c;要求全部是数字&#xff0c;长度是(6-20&#xff09;之间&#xff0c;不能以0开头 首先用自己编写的程序判断QQ号码是否正确 public static void main(String[] args) {Sy…...

图数据库_Neo4j_Centos7.9安装Neo4j社区版3.5.4_基于jdk1.8---Neo4j图数据库工作笔记0011

首先上传安装包,到opt/soft目录 然后看一下jdk安装的是什么版本的,因为在neo4j 4以后就必须要用jdk11 以上的版本,我这里还用着jdk1.8 所以 我这里用3.5.4的版本 关于下载地址: https://dist.neo4j.org/neo4j-community-3.5.4-unix.tar.gz 然后再去解压到/opt/module目录下 …...

使用Rust编写的一款使用遗传算法、神经网络、WASM技术的模拟生物进化的程序

模拟生物进化程序 Github地址&#xff1a;FishLife 期待各位的star✨✨✨ 本项目是一个模拟生物进化的程序&#xff0c;利用遗传算法、神经网络技术对鱼的眼睛和大脑进行模拟。该项目是使用 Rust 语言编写的&#xff0c;并编译为 WebAssembly (Wasm) 格式&#xff0c;使其可以…...

UE4/UE5 “无法双击打开.uproject 点击无反应“解决

一、方法一&#xff1a;运行UnrealVersionSelector.exe 1.找到Epic Game Lancher的安装目录&#xff0c; 在lancher->Engine->Binaries->Win64->UnrealVersionSelector.exe 2.把UnrealVersionSelector.exe 分别拷贝到UE4 不同版本引擎的 Engine->Binaries->…...

【前端】深入理解CSS定位

目录 一、前言二、定位组成1、定位模式1.1、静态定位static①、语法定义②、特点 1.2、相对定位relative①、语法定义②、特点③、代码示例 1.3、绝对定位absolute①、语法定义②、特点③、代码示例1&#xff09;、没有祖先元素或者祖先元素没有定位2&#xff09;、祖先元素有定…...

【问题】分布式事务的场景下如何保证读写分离的数据一致性

我的理解这个题目可以获得以下关键字&#xff1a;分布式处理、读写分离、数据一致性 那么就从”读写分离“做切入口吧&#xff0c;按我的理解其实就是在保证数据一致性的前提下两个&#xff08;或以上&#xff09;的数据库分别肩负不同的数据处理任务。太过久远的就不说了&…...

常见的Web安全漏洞有哪些,Web安全漏洞常用测试方法介绍

Web安全漏洞是指在Web应用程序中存在的可能被攻击者利用的漏洞&#xff0c;正确认识和了解这些漏洞对于Web应用程序的开发和测试至关重要。 一、常见的Web安全漏洞类型&#xff1a; 1、跨站脚本攻击(Cross-Site Scripting&#xff0c;XSS)&#xff1a;攻击者通过向Web页面注入…...

随机微分方程

应用随机过程|第7章 随机微分方程 见知乎&#xff1a;https://zhuanlan.zhihu.com/p/348366892?utm_sourceqq&utm_mediumsocial&utm_oi1315073218793488384...

下载安装并使用小乌龟TortoiseGit

1、下载TortoiseGit安装包 官网&#xff1a;Download – TortoiseGit – Windows Shell Interface to Githttps://tortoisegit.org/download/ 2、小乌龟汉化包 在官网的下面就有官方提供的下载包 3、安装...

npm ERR!Cannot read properties of null(reading ‘pickAlgorithm’)报错问题解决

当在使用npm包管理器或执行npm命令时&#xff0c;有时候会遇到“npm ERR!Cannot read properties of null(reading ‘pickAlgorithm’)”这个错误提示&#xff0c;这是一个常见的npm错误。 这个错误提示通常说明在使用npm包管理器时&#xff0c;执行了某个npm命令&#xff0c;…...

web前端tips:js继承——组合继承

上篇文章给大家分享了 js继承中的借用构造函数继承 web前端tips&#xff1a;js继承——借用构造函数继承 在借用构造函数继承中&#xff0c;我提到了它的缺点 无法继承父类原型链上的方法和属性&#xff0c;只能继承父类构造函数中的属性和方法 父类的方法无法复用&#xff0…...

(7)(7.3) 自动任务中的相机控制

文章目录 前言 7.3.1 概述 7.3.2 自动任务类型 7.3.3 创建合成图像 前言 本文介绍 ArduPilot 的相机和云台命令&#xff0c;并说明如何在 Mission Planner 中使用这些命令来定义相机勘测任务。这些说明假定已经连接并配置了相机触发器和云台(camera trigger and gimbal hav…...

Python 爬虫小练

Python 爬虫小练 获取贝壳网数据 使用到的模块 标准库 Python3 标准库列表 os 模块&#xff1a;os 模块提供了许多与操作系统交互的函数&#xff0c;例如创建、移动和删除文件和目录&#xff0c;以及访问环境变量等。math 模块&#xff1a;math 模块提供了数学函数&#xf…...

vue3 事件处理 @click

在Vue 3中&#xff0c;事件处理可以通过click指令来实现。click指令用于监听元素的点击事件&#xff0c;并在触发时执行相应的处理函数。 下面是一个简单的示例&#xff0c;展示了如何在Vue 3中处理点击事件&#xff1a; <template><button click"handleClick&…...

【第三阶段】kotlin语言使用replace完成加解密操作

fun main() {val password"ASDAFWEFWVWGEGSDFWEFEWGFS"println("原始密码&#xff1a;$password")//加密操作,就是把字符替换成数字&#xff0c;打乱加密var newPsdpassword.replace(Regex("[ADWF]")){when(it.value){//it.value 这里的每一个字…...

springBoot是如何实现自动装配的

目录 1 什么是自动装配 2 Spring自动装配原理 2.1 SpringBootConfiguration ​编辑 2.2 EnableAutoConfiguration 2.2.1 AutoConfigurationPackage 2.2.2 Import({AutoConfigurationImportSelector.class}) 2.3 ComponentScan 1 什么是自动装配 自动装配就是将官方写好的的…...

基于python+MobileNetV2算法模型实现一个图像识别分类系统

一、目录 算法模型介绍模型使用训练模型评估项目扩展 二、算法模型介绍 图像识别是计算机视觉领域的重要研究方向&#xff0c;它在人脸识别、物体检测、图像分类等领域有着广泛的应用。随着移动设备的普及和计算资源的限制&#xff0c;设计高效的图像识别算法变得尤为重要。…...

管理类联考——逻辑——真题篇——按知识分类——汇总篇——二、论证逻辑——归纳评价——归纳谬误

文章目录 第一节 归纳谬误题-归纳评价-归纳谬误题-归纳评论-归纳谬误-比率→数量,从基数找问题真题(2019-39)-归纳评论-归纳谬误-先归纳题干错误-诉诸人身分成:①诉诸权威:某人在某方面很权威,他做什么都是对的。②人身攻击:因为过往履历有问题,所以做什么都是错的。③…...

C++适配器模式

1 简介&#xff1a; 适配器模式是一种结构型设计模式&#xff0c;用于将一个类的接口转换为客户端所期望的另一个接口。适配器模式允许不兼容的类能够协同工作&#xff0c;通过适配器类来实现接口的转换和适配。 2 实现步骤&#xff1a; 以下是使用C实现适配器模式的步骤&…...