uniapp使用vue3的ref获取dom元素出现undefined

news2024/11/16 13:54:55

在我的代码里面,已经通过ref来定义想要获取的dom了,但是最后在页面渲染完之后,打印这个dom发现竟然是undefined: 

获取不到dom元素:

最后查资料发现:

小程序中,uniapp的ref要绑定在子组件中才能被获取,如果绑定在view,是获取不了的,你得把业务写在一个组件来引用才行。h5则没有这种情况。

暂时没有好的解决办法,因为我用到了html2canvas这个依赖包,需要将页面转化为一张图片保存,那么微信小程序获取不到dom元素,就只能使用另外的办法。

另外的办法说明:

1.单独部署一个h5页面,然后在h5页面中生成图片,并将图片存储到服务器中,然后返回给下载地址。

2.本地自己使用canvas画一个你需要的图片,但是难度估计非常大

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

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

相关文章

【算法】【动规】乘积为正数的最长子数组长度

跳转汇总链接 👉🔗算法题汇总链接 1.1 乘积为正数的最长子数组长度 🔗题目链接 给你一个整数数组 nums ,请你求出乘积为正数的最长子数组的长度。 一个数组的子数组是由原数组中零个或者更多个连续数字组成的数组。 请你返回乘积…

基于ssm生活缴费系统及相关安全技术的设计与实现论文

摘 要 互联网发展至今,无论是其理论还是技术都已经成熟,而且它广泛参与在社会中的方方面面。它让信息都可以通过网络传播,搭配信息管理工具可以很好地为人们提供服务。针对生活缴费信息管理混乱,出错率高,信息安全性差…

AI会干掉美图秀秀们吗?

网上流传着这样一个传说,亚洲有三大“邪术”,韩国整容术、日本化妆术,还有震惊世界的中国PS 术。虽然是网友的戏称,但也反映了PS美图技术在国内盛行一时。 而说起美图技术就不得不提到美图公司,但美图公司近些年的日子…

陪玩系统圈子系统:打破孤单,寻找游戏共伴!APP小程序H5三端源码交付,支持二开!喜欢软件开发的朋友可以一起交流!

在如今快节奏的生活中,游戏作为一种娱乐方式,早已融入了人们的生活,成为许多人放松心情、释放压力的方式之一。然而,与此同时,游戏中的孤独感也成为一些玩家所面临的问题。为了解决这个问题,陪玩系统圈子系…

NorFlash 知识点总结

一、介绍 NorFlash(也称为 NOR 型闪存)是一种非易失性存储器,常用于嵌入式系统和存储设备中。NorFlash 是一种闪存类型,可以用于存储程序代码、固件、操作系统以及其他数据。与 NAND Flash 相比,NorFlash 具有较低的存…

C语言之动态内存管理

一、引言 当我们写了一段程序,创建了一个变量或者一个数组,这些操作都需要在内存中开辟出一块空间。但是我们过去的这些操作有一定的局限性:开辟的空间大小是固定的,并且数组在申明的时候,必须指定数组的长度&#xf…

HarmonyOS创建属性动画

属性动画的使用 1 概述 属性动画,是最为基础的动画,其功能强大、使用场景多,应用范围较广。常用于如下场景中: 一、页面布局发生变化。例如添加、删除部分组件元素。二、页面元素的可见性和位置发生变化。例如显示或者隐藏部分…

RHEL8中ansible的安装

本章主要介绍在RHEL8中如何安装ansible ansible是如何工作的在RHEL8中安装ansible 1.1 ansible的工作原理 如果管理的服务器很多,如几十台甚至几百台,那么就需要一个自动化管理工具了, ansible就是这样的一种自动化管理工具 ansible是通过…

用print太慢了!强烈推荐这款Python Debug工具~

作为程序员,我们都深知调试(Debug)在编程过程中的重要性。然而,使用传统的"print"语句进行调试可能效率较低,今天,笔者将推荐一款独具一格的Python调试工具——Reloadium。Reloadium为IDE添加了热…

【PyTorch】卷积神经网络

文章目录 1. 理论介绍1.1. 从全连接层到卷积层1.1.1. 背景1.1.2. 从全连接层推导出卷积层 1.2. 卷积层1.2.1. 图像卷积1.2.2. 填充和步幅1.2.3. 多通道 1.3. 池化层(又称汇聚层)1.3.1. 背景1.3.2. 池化运算1.3.3. 填充和步幅1.3.4. 多通道 1.4. 卷积神经…

Google Tag Manager账号的创建

1,通过官网链接进入主页面 点击创建账号 官网链接-https://www.tagmanager.google.com 2,按提示填写账号名称 账号名称建议填写网址,或者公司名称,全称简称都可, 国家地区按默认的就好不用特地更改, 不…

MySQL进阶2 - 索引

MySQL进阶1 - 索引 1. 索引概述2. 索引结构2.1 二叉树2.2 B-Tree(多路平衡查找树)2.3 BTree2.4 Hash 3. 索引分类4. 索引语法5. SQL性能分析5.1 SQL执行频率5.2 慢查询日志5.3 profile5.4 explain执行计划5.3.1 EXPLAIN执行计划各字段含义: 6. 索引使…

vue实现滑动验证

效果图: 源码地址:github文档地址: https://github.com/monoplasty/vue-monoplasty-slide-verify 使用步骤:1,安装插件: npm install --save vue-monoplasty-slide-verify 在main.js中使用一下&#xff…

记一次跨入smartKettle大门随即转身就走的简单体验过程

目录 📚第一章 背景📗目的📗总体方向 📚第二章 源码解读📗官方说明📗controller接口📕swagger📕源码 📗Kettle API 📚第三章 总结⁉️问题记录❓问题一&#…

使用CFimagehost源码自建无需数据库支持的PHP图片托管服务

文章目录 1.前言2. CFImagehost网站搭建2.1 CFImagehost下载和安装2.2 CFImagehost网页测试2.3 cpolar的安装和注册 3.本地网页发布3.1 Cpolar临时数据隧道3.2 Cpolar稳定隧道(云端设置)3.3.Cpolar稳定隧道(本地设置) 4.公网访问测…

SpringCloud系列(六)| 聊聊负载均衡

一、负载均衡概述 上一篇文章中,我们在集成OpenFeign的过程中提示我们需要加入了一个依赖就是: spring-cloud-starter-loadbalancer。 顾名思义,这个包的作用就是用来做负载均衡的。 简单解释一下什么是负载均衡,就是当我们的服…

Python面经【11】- Python可迭代对象一网打尽专题

Python面经【11】- Python可迭代对象一网打尽专题 可迭代对象Python的迭代器、生成器1) 迭代器2) 生成器 可迭代对象、迭代器的区别12. 生成器、迭代器的区别什么是装饰器?函数装饰器有什么作用一句话解释什么样的语言能够使用装饰器Python中的作用域?什…

节流防抖:提升前端性能的秘密武器(上)

🤍 前端开发工程师(主业)、技术博主(副业)、已过CET6 🍨 阿珊和她的猫_CSDN个人主页 🕠 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 🍚 蓝桥云课签约作者、已在蓝桥云…

我常用的几个经典Python模块

Python常用的模块非常多,主要分为内置模块和第三方模块两大类,且不同模块应用场景不同又可以分为文本类、数据结构类、数学运算类、文件系统类、爬虫类、网络通讯类等多个类型。 大家常用的内置模块比如:math、re、datetime、urllib、os、ra…

自动化测试流程详解

最近很多小伙伴问我自动化测试到底该怎么做?流程是什么样的?在每个阶段都需要注意什么?本文也就主要从自动化测试的基本流程入手,对面试自动化测试工程师的同学会有不少帮助。对于在职的朋友,也可以参考此流程&#xf…