vue无法获取dom

处理过程

watch监听值变化

index.js:33  [Vue warn]: Error in callback for watcher "$store.state.modelsStorageUrl": "TypeError: Cannot set properties of undefined (setting 'modelScene')"
watch: {"$store.state.modelsStorageUrl":{handler:(newVal,oldVal)=>{console.log("watched")console.log("oldVal",oldVal);console.log("newVal",newVal);if(oldVal!==''){console.log("加载速度快",oldVal)this.modelScene = new loadModel(oldVal);this.loadModelsUrl()console.log(this.modelScene)}if(oldVal!==newVal){console.log("加载速度慢",newVal,oldVal)console.log("oldVal",oldVal);console.log("newVal",newVal);this.modelScene = new loadModel(newVal);this.loadModelsUrl()console.log(this.modelScene)}if(newVal){console.log("加载速度慢2",newVal)this.modelScene = new loadModel(newVal);this.loadModelsUrl()console.log("this.modelScene",this.modelScene)}}}
}

this 指向问题

参考文档

  1. vue 生命周期函数不建议使用箭头函数,使用function
  2. this.$nextTick 使用箭头函数。
created() {this.loadModelsUrl()
},
methods: {loadModelsUrl(){this.$nextTick(()=>{setTimeout(() => {this.modelScene.showPageViewScene(this.$refs.three_canvas,this.width,this.height)this.percentage = 100}, 2)})}
}

解决

最后原因 computed 报错 导致页面没有加载DOM,所以this.$refs.three_canvas
无法获取到在这里插入图片描述

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

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

相关文章

最优化理论期末复习笔记 Part 1

数学基础线性代数 从行的角度从列的角度行列式的几何解释向量范数和矩阵范数 向量范数矩阵范数的更强的性质的意义 几种向量范数诱导的矩阵范数 1 范数诱导的矩阵范数无穷范数诱导的矩阵范数2 范数诱导的矩阵范数 各种范数之间的等价性向量与矩阵序列的收敛性 函数的可微性与展…

法线贴图可以实现什么样的3D效果

在线工具推荐: 3D数字孪生场景编辑器 - GLTF/GLB材质纹理编辑器 - 3D模型在线转换 - Three.js AI自动纹理开发包 - YOLO 虚幻合成数据生成器 - 三维模型预览图生成器 - 3D模型语义搜索引擎 在 3D 建模中,曲面由多边形表示。照明计算是基于这些多边…

4《数据结构》

文章目录 绪论逻辑结构存储结构【物理结构】顺序和链式存储区别顺序表和数组区别数组和链表的区别链表结点概念链表为空条件链表文章http://t.csdnimg.cn/dssVK二叉树B树B树【MYSQL索引默认数据结构】B树和B树区别冒泡排序插排选排快排 绪论 数据结构:研究非数值计…

【计算机算法设计与分析】n皇后问题(C++_回溯法)

文章目录 题目描述测试样例算法原理算法实现参考资料 题目描述 在nxn格的棋盘上放置彼此不受攻击的n格皇后。按照国际象棋的规则,皇后可以攻击与之处在同一行或同一列或同一斜线上的棋子。n后问题等价于在nxn格的棋盘上放置n个皇后,任何2个皇后不放在同…

《掌握需求优先级排序,成功项目从此起步》

需求优先级排序是软件开发过程中至关重要的一环。通过合理的需求优先级排序,可以更好地把握项目进度,避免在后期因为需求的变更而造成项目延期或成本超支等问题。下面,本文将从需求的角度出发,探讨如何进行需求优先级排序。 一、…

Css中默认与继承

initial默认样式: initial 用于设置 Css 属性为默认值 h1 {color: initial; }如display或position不能被设置为initial,因为有默认属性。例如:display:inline inherit继承样式: inherit 用于设置 Css 属性应从父元素继承 di…

国产服务器操作系统PXE安装脚本 可重复执行(rc08版本)

执行效果如下: #!/bin/bash #Date:2023/12/25 #Func:一键部署pxe服务器 #Author:Zhanghaodong #Version:2023.12.25.05 #Note:仅适用x86架构uefi安装 # 1.此脚本可多次重复执行。 # 2.如遇到某个服务异常退出,检查响应状态码排错后&#xff0c…

VINS-MONO拓展2----更快地makeHessian矩阵

1. 目标 完成大作业T2 作业提示: 多线程方法主要包括以下几种(参考博客): MPI(多主机多线程开发),OpenMP(为单主机多线程开发而设计)SSE(主要增强CPU浮点运算的能力)CUDAStream processing, 之前已经了解过std::thread和pthread,拓展1…

【持续学习系列(七)】Gradient Episodic Memory for Continual Learning

一、论文信息 1 标题 Gradient Episodic Memory for Continual Learning 2 作者 David Lopez-Paz and Marc’Aurelio Ranzato 3 研究机构 Facebook Artificial Intelligence Research 二、主要内容 论文主要探讨了持续学习(continual learning)的…

SpringBoot实用开发(九)-- RedisTemplate处理ZSet类型的数据

目录 1.添加元素(有序集合是按照元素的score值由小到大进行排列) 2.删除对应的value,value可以为多个值

mybatis批量同时更新或者插入数据

可以使用 MySQL 的 INSERT INTO … ON DUPLICATE KEY UPDATE 语句来实现批量插入更新。 假设有一个表 ams_storageCargo,其主键为 id,可以将数据列表存储在一个 List 对象中,然后使用 MyBatis 的 foreach 标签进行循环插入,同时使…

工作中人员离岗识别摄像机

工作中人员离岗识别摄像机是一种基于人工智能技术的智能监控设备,能够实时识别员工离岗状态并进行记录。这种摄像机通常配备了高清摄像头、深度学习算法和数据处理系统,可以精准地监测员工的行为,提高企业的管理效率和安全性。 工作中人员离岗…

OpenCV 安装概述

OpenCV 核心团队的软件包 每个版本都会发布使用默认参数和最新编译器构建的适用于 Android、iOS 和 Windows 的包,它们不包含opencv_contrib模块。 GitHub 版本:Releases opencv/opencv GitHubSourceForge.net: OpenCV - Browse Files at…

在Go语言中处理HTTP请求中的Cookie

在Web开发中,Cookie是一种常用的技术,用于在客户端存储数据,并在随后的请求中发送回服务器。Go语言的标准库提供了强大的支持来处理HTTP请求中的Cookie。 首先,让我们了解如何在Go语言中设置Cookie。以下是一个简单的示例&#x…

MySQL基础笔记(4)DQL数据查询语句

DQL用于查找数据库中存放的记录~ 目录 一.语法 二.基础查询 1.查询多个字段 2.设置别名 3.去除重复记录 三.条件查询 1.基础语法 2.常见条件 四.分组查询 1.聚合函数 2.语法 五.排序查询 六.分页查询 附注:DQL执行顺序 1.编写顺序 2.执行顺序 ​​​…

oracle数据库修改已使用过的序列当前值

--查询当前值 select seq_test.nextval from dual; ----修改序列为增加的步长为50 alter sequence seq_test increment by 50 nocache; ---获取调整后的下一个值 select seq_test.nextval from dual; ----修改序列为原来的规则 alter sequence seq_test increment b…

VLAN的基础知识

VLAN配置 - NetEngine 8000 M14K, M14, M8K, M8, M4, 8000E M14, M8 V800R022C10SPC500 配置指南 - 华为 VLAN介绍 定义 VLAN(Virtual Local Area Network)即虚拟局域网,是将一个物理的LAN在逻辑上划分成多个广播域(多个VLAN&a…

安装阿里云CLI之配置阿里云凭证信息

有时候需要再主机上通过 OpenAPI 的调用访问阿里云,并完成控制,此时就需要在服务器上安装阿里云CLI,并完成账号的设置。 1. 登录阿里云创建账号 1.1 点击阿里云头像 ——》 控制访问 ——》创建一个拥有DNS权限的用户 这个用户不用太多权限…

如何在Rust中解析复杂的嵌套JSON结构?

在Rust中解析复杂的嵌套JSON结构可以使用serde_json库。通过serde_json::Value类型的递归遍历,可以轻松地解析和访问嵌套的JSON数据。以下是一个示例: use serde_json::{Value};fn parse_json(json: &Value) {match json {Value::Object(obj) > …

小程序购物商城搭建开发分析

小程序商城作为现代商业模式的重要组成部分,具有巨大的发展潜力和商业价值。通过搭建一个功能完善、用户友好的小程序商城,您将能够提供便捷的购物体验,吸引更多的用户并实现商业增长。在进行小程序商城开发搭建之前,我们需要对项…