vue中this.$refs可以拿到,但是里面的属性undefind的问题
1.和vue的生命周期有关,必须要在从mounted开始拿,才能拿得到里面的Dom元素
2.想在element ui 对话框打开后取dom时,应该使用$nextTick
,而不是直接使用this.$refs. imgLocal2
:
console.log('this.$refs.imgLocal2外面', this.$refs.imgLocal2);
setTimeout(() => {
console.log('this.$refs.imgLocal2 setTimeout', this.$refs.imgLocal2);
}, 500); // 不推荐
this.$nextTick(() => {
console.log('this.$refs.imgLocal2 $nextTick', this.$refs.imgLocal2);
});
vue中this.$refs可以拿到,但是里面的属性undefind的问题的更多相关文章
- vue中使用refs定位dom出现undefined?
之前在公司做项目,一直感觉用ref来定位dom节点挺方便的.但是期间遇到了一个问题,就是在mounted(){}钩子里面使用this.$refs.xxx,打印出来的却是undefined? 于是我就对 ...
- typescript无法识别vue中的$refs
例如:vue-fullscreen <template> <div class="Test"> <fullscreen ref="fulls ...
- 针对vue中请求数据对象新添加的属性不能响应式的解决方法
1.需要给对象添加属性时,不能采用传统的obj.属性=值,obj[属性]=值 来添加属性,在vue页面时需要这样使用 this.$set(obj,"propertyName",&q ...
- vue中watch检测到不到对象属性的变化的解决方法
watch: { option: { handler(newVal) { console.log(newVal); }, deep: true, immediate: true } }, 需要深层wa ...
- 在vue中操作dom元素
在vue中可以通过给标签加ref属性,就可以在js中利用ref去引用它,从而达到操作该dom元素,以下是个参考例子 1 <template> 2 <div> 3 <div ...
- vue中什么样的数据可以是在视图中显示
1. Vue中不可以添加不存在的属性,因为不存在的属性是没有getter和setter的. <div id="app"> {{msg.a}} {{msg.b}} < ...
- vue中如何实现数据的双向绑定
vue中如何实现数据的双向绑定 实现视图变化数据跟着变:分两步,上面get中的为第二步(即再次读取的时候会调用get方法得到之前设置的值,以此来实现动态改变) 由于直接写obj.name = this ...
- vue系列---理解Vue中的computed,watch,methods的区别及源码实现(六)
_ 阅读目录 一. 理解Vue中的computed用法 二:computed 和 methods的区别? 三:Vue中的watch的用法 四:computed的基本原理及源码实现 回到顶部 一. 理解 ...
- 详解Vue中的computed和watch
作者:小土豆 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.cn/user/2436173500265335 1. 前言 作为一名Vue ...
随机推荐
- 【题解】Tom的烦恼
题目描述 Tom是一个非常有创业精神的人,由于大学学的是汽车制造专业,所以毕业后他用有限的资金开了一家汽车零件加工厂,专门为汽车制造商制造零件.由于资金有限,他只能先购买一台加工机器.现在他却遇到了麻 ...
- python-面向对象中的特殊方法 ,反射,与单例模式
二,面相对象的特殊成员及相关内置函数 2.1 isinstance与issubclass isinstance(obj,cls)检查是否obj是否是类 cls 的对象 class A: pass cl ...
- Mysq sql语句教程
mysql管理命令 show databases; 显示服务器上当前所有的数据库 use 数据库名称; 进入指定的数据库 show tables; 显示当前数据库中所有的数据表 d ...
- USACO Milk Routing /// 优先队列广搜
题目大意: 在n个点 m条边的无向图中 需要运送X单位牛奶 每条边有隐患L和容量C 则这条边上花费时间为 L+X/C 求从点1到点n的最小花费 优先队列维护 L+X/C 最小 广搜到点n #inclu ...
- 寻找链表倒数第k个元素,只遍历一遍(编程之美)
class LNode { public LNode next; public int data; } /*找出倒数第k个元素,只遍历一遍*/ class Kk { private static LN ...
- 在linux上安装jdk
一.环境 1. VMware虚拟机 2. Linux系统(centos7) 安装步骤: 1. 先安装VMtools 2. 查看是否有openjdk,若有先将系统内的openJDK删除(采用 r ...
- 在阅读众多的blog中,我学到了什么
写博客的人,自然会读别人的博客:读博客的人,不一定会写博客.但是这两种人之间的差别是很大的 在最近在一段时间,发现了一个好的博客,通过该博客的友链,发现了新大陆.... 从Jeff Wong开始,到老 ...
- laravel将数组转换成集合
$myArray = collect($this -> menuPermissionTypes); //$this -> menuPermissionTypes是数组! dd($myArr ...
- Java 基础 -- BigInteger BigDecimai大数
BigInteger 加减乘除 BigInteger bi1 = new BigInteger("123456789") ; // 声明BigInteger对象 BigIntege ...
- java-逻辑处理
类名是ItemDAO package dao; import java.sql.Connection; import java.sql.PreparedStatement; import java.s ...