ref是被用来给元素或子组件注册引用信息。引用信息将注册在父组件的 $refs 对象身上。如果在普通的DOM元素身上使用,引用指向就是DOM元素;如果用在子组件身上,引用就是指向组件实例。

当v-for用于元素或组件身上时,引用循序就是将包含DOM节点或组件实例的数组。

关于ref注册时间的重要说明:因为ref本身就是作为渲染结果被创建的,在初始渲染的时候不能被范文-他们还不存在! $ref也不是响应式的,因此你不应该试图它用在模板中做数据绑定。

补充一点:

  如果你一定要在钩子函数 created()   或者mounted()使用$refs拿到dom元素或者实例,就应该配合使用 this.$nextTick( () => {在此处拿}),这个函数非常的好用呦!!!

ref、refs使用的注意事项的更多相关文章

  1. Git Push:error: Couldn't set refs/remotes/origin/master;error: update_ref failed for ref 'refs/remot

    作者:荒原之梦 原文链接:http://zhaokaifeng.com/?p=543 今天使用Git Push代码时产生错误: Rename from 'XXXX/.git/refs/remotes/ ...

  2. error: cannot lock ref 'refs/remotes/origin/master': unable to resolve reference 'refs/remotes/origin/master': reference broken...

    之前在自己的项目中添加了一个分支,然后做了一些操作,比如同步本地的分支情况到远程仓库中,然后在远程仓库中完成分支合并,以及 Pull request 等等操作,后来,在本地仓库中进行 git fetc ...

  3. 项目记事【Git】:git pull 出错 error: cannot lock ref 'refs/remotes/origin/feature/hy78861': is at d4244546c8cc3827491cc82878a23c708fd0401d but expected a6a00bf2e92620d0e06790122bab5aeee01079bf

    今天 pull 代码的时候碰到以下问题(隐去了一些公司敏感信息): XXX@CN-00012645 MINGW64 /c/Gerrard/Workspace/XXX (master) $ git pu ...

  4. Vue.js中ref ($refs)用法举例总结

    原文地址:http://www.cnblogs.com/xueweijie/p/6907676.html <div id="app"> <input type=& ...

  5. vue里ref ($refs)用法

    ref 有三种用法: 1.ref 加在普通的元素上,用this.ref.name 获取到的是dom元素 2.ref 加在子组件上,用this.ref.name 获取到的是组件实例,可以使用组件的所有方 ...

  6. Vue 中的 ref $refs

    ref 被用来给DOM元素或子组件注册引用信息.引用信息会根据父组件的 $refs 对象进行注册.如果在普通的DOM元素上使用,引用信息就是元素; 如果用在子组件上,引用信息就是组件实例 注意:只要想 ...

  7. Vue父子组件传值$parent , ref,$refs,props大总结

    子组件: <template> <div class="child"> <slot name='meiyong'></slot> & ...

  8. error: dst ref refs/heads/zhCN_v0.13.1 receives from more than one src.

    http://segmentfault.com/q/1010000000257571 想要把本地的分支推送到远端 git push chucklu zhCN_v0.13.1 zhCN_v0.13.1 ...

  9. Git Pull Failed: cannot lock ref 'refs/remotes/origin/xxxxxxxx': unable to resolve ref

    1.xxxxxxxx代表目录名称,我要pull的目录是supman_creditmall_v5: 2.从代码库中pull代码时报这个错误,代码pull失败: 3.解决办法,看下图,删除文件后再pull ...

随机推荐

  1. 【学习笔记】使用SQLyog连接MySQL数据库

    一.使用SQLyog创建数据库用来管理学生信息 #创建数据库student DROP DATABASE IF EXISTS Myschool; CREATE DATABASE Myschool; #在 ...

  2. C#学习笔记10

    1.匿名类型:匿名类型是C#3.0新增的特性,是强类型(由编译器后台在生成为CIL时,自动声明的代码定义类型),声明与初始化属性后其属性是尽读属性.只有在属性的名称.顺序.类型一致时,多个声明匿名变量 ...

  3. Oracle中scott用户下基本表练习SQL语句

    --选择部门中30的雇员SELECT * from emp where DEPTNO=30;--列出所有办事员的姓名.部门.编号--采用内连接方式,也就是等值链接,也是最常用的链接SELECT ena ...

  4. SQL使用bcp方式导入,导出数据2

    select * from A_Account   EXEC sp_configure 'allow_updates' GO EXEC sp_configure 'allow_updates',0; ...

  5. 检测IE浏览器兼容Edge模式及IE11

    document.documentMode || +(navigator.userAgent.match(/MSIE (\d+)/) && RegExp.$1) 判断布尔值

  6. 菜鸟学习Spring——SpringMVC注解版前台向后台传值的两种方式

    一.概述. 在很多企业的开法中常常用到SpringMVC+Spring+Hibernate(mybatis)这样的架构,SpringMVC相当于Struts是页面到Contorller直接的交互的框架 ...

  7. 排查在 Azure 中创建新 Linux 虚拟机时遇到的 Resource Manager 部署问题

    本文内容 常见问题 收集活动日志 问题:自定义映像:预配错误 问题:自定义/库/应用商店映像:分配失败 后续步骤 尝试创建新的 Azure 虚拟机 (VM) 时,遇到的常见错误是预配失败或分配失败. ...

  8. jetbrain rider 逐渐完美了,微软要哭了么?

    2019-03-24 10:08:42 多年的vsiual studio使用经验,各种小瑕疵:到现在的visual studio是越来越大了:简直到了无法忍受境地: 每次重装系统都要重新安装下,这个不 ...

  9. 『看球笔记』20131230切尔西vs利物浦,赛后复盘聊聊球

    2013-12-30 第十九轮英超联赛 切尔西vs利物浦         看着这张板凳合照… 有木有一种心里哇凉哇凉的感觉.   赛后whoscored的平均位置图 左边车子,右边我军     阿格回 ...

  10. Apache轻量级性能測试工具--ab

    Apache轻量级性能測试工具--ab ab早已不是什么新奇玩意,平时工作中会须要一些性能測试.简单的性能測试全然能够由AB来替代,而不须要动用LR这样重量级的工具. 此文简介一下ab的工具使用与结果 ...