mouted vue 操作dom_vue中使用refs定位dom的坑-阿里云开发者社区

使用element-ui的表单验证,出现"this.$refs.ruleForm.validate is not a function"

使用mint-ui的popup,在mounted(){}钩子里面使用this.$refs.xxx，打印出来的却是undefined

以上的问题,貌似没有关联,但深究下去,都存在这个状况:在mounted钩子中使用this.$refs，而ref是定位在有v-if、v-for、v-show中的DOM节点.

为什么这种状况下,会出现问题呢? 我们仔细的了解一下vue的实例生命周期

我的理解是:

mounted阶段,DOM结构已经出来了,但是如果在DOM结构中的某个DOM节点(virtual DOM)使用了v-if、v-show或者v-for(即根据获得的后台数据来动态操作DOM，即响应式)，那么这些DOM是不会再mounted阶段找到的.所以才会有undefined等错误

所以如果想要真正地在DOM加载完成后拿到数据，就需要调用VUE的全局api ： this.$nextTick(() => {})

使用element的表单验证,如果是是配合v-show,v-if使用,使用自定义验证函数的形式.

如果配合v-for使用,那么请参照示例,写成形如 :prop="productGroup.${index}.num"

详见(https://yq.aliyun.com/articles/712112/edit?spm=a2c4e.11153940.0.0.62481ce5pth2vH)

mouted vue 操作dom_vue中使用refs定位dom的坑-阿里云开发者社区相关推荐

mysql double 存储_关于MYSQL中FLOAT和DOUBLE类型的存储-阿里云开发者社区
关于MYSQL中FLOAT和DOUBLE类型的存储重庆八怪 2016-04-12 844浏览量简介: 关于MYSQL中FLOAT和DOUBLE类型的存储其实在单精度和双精度浮点类型存储中其存储方 ...
不属于python标准库的是_《Python Cookbook（第2版）中文版》——1.10 过滤字符串中不属于指定集合的字符-阿里云开发者社区...
本节书摘来自异步社区<Python Cookbook(第2版)中文版>一书中的第1章,第1.10节,作者[美]Alex Martelli , Anna Martelli Ravenscro ...
mouted vue 操作dom_vue中关于dom的操作
mounted 个人理解为DOM结构准备就绪了,可以开始加载vue数据了, 挂载点,配合使用 mounted:function(){ this.$nextTick(function(){ //this ...
vue怎么vw布局好用_Vue项目中使用vw实现移动端适配-阿里云开发者社区
我们在vue移动端项目中的适配一般都采用rem,但是rem也不是能兼容所有的终端. 随着viewport单位越来越受到众多浏览器的支持,下面将简单介绍怎么实现vw的兼容问题,用vw代替rem 当我们采 ...
mysql5.5索引如何定义_MySQL5.5索引数在InnoDB引擎内与索引数在mysql中定义的数量是不一致问题-阿里云开发者社区...
在查看MySQL错误日志的时候发现这样的错误,如下: 160322 21:42:59 [ERROR] Table baby/baby_order contains 12 indexes inside ...
spring mysql_eclipse中spring访问mysql的简易实现-阿里云开发者社区
eclipse中构建一个maven基础上的带有TestNG测试插件的spring项目目录结构如下所示: 这个简易的实现,包括四个文件 1.java源码(访问数据库代码) 2.测试源码(TestNG测 ...
查询mysql数据库表占用空间大小_查看 MySQL 数据库中每个表占用的空间大小-阿里云开发者社区...
如果想知道MySQL数据库中每个表占用的空间.表记录的行数的话,可以打开MySQL的 information_schema 数据库.在该库中有一个 TABLES 表,这个表主要字段分别是: TABLE ...
python集合可以修改吗_修改包含Python3中的集合的集合列表-问答-阿里云开发者社区-阿里云...
我试图创建一个以元组为元素的列表.每个元组都有4个整数.前两个整数是对2个range进行压缩的结果,而其他2个则是对2个不同的整数进行压缩的结果. 我正在使用此代码创建元组和最终列表,这些列表是从笛卡 ...
freebsd mysql 安装_Freebsd中mysql安装及使用笔记-阿里云开发者社区
Freebsd中mysql安装及使用笔记 x3d 2009-07-31 662浏览量简介: 1.安装一开始连mysql的软件包在freebsd中叫什么都不知道: 依稀属于databases类,先到 ...

mouted vue 操作dom_vue中使用refs定位dom的坑-阿里云开发者社区

mouted vue 操作dom_vue中使用refs定位dom的坑-阿里云开发者社区相关推荐

最新文章

热门文章