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. WPF-MVVM学习心德（WinForm转WPF心德）

    接触MVVM接近一段时间了,有一点理解,写下来. 之前是做winform的,工作需要,学习wpf.优缺点就不用说类,网上一大堆.我自己理解的话,有下面几点: 1.首先是界面的xmal和界面分离:wpf ...

  2. redis的有序集合（Sorted Sets）数据类型

    和Sets相比,Sorted Sets增加了一个权重参数score,使得集合中的元素能够按score进行有序排列,比如一个存储全班同学成绩的Sorted Sets,其集合value可以是同学的学号,而 ...

  3. 绘图和数据可视化工具包——matplotlib

    一.Matplotlib介绍 Matplotlib是一个强大的Python**绘图**和**数据可视化**的工具包. # 安装方法 pip install matplotlib # 引用方法 impo ...

  4. HTML行内元素、块状元素和行内块状元素的区分

    HTML 5 的常用元素分类 HTML可以将元素分类方式分为行内元素.块状元素和行内块状元素三种,这三者是可以互相转换的,通过display属性可以实现互相转换 (1)display:inline;转 ...

  5. 如何取消IntelliJ IDEA打开默认项目配置

    一.前言            在前端中,个人比较喜欢使用IntelliJ IDEA开发工具!IntelliJ IDEA是非常强大的开发集成工具,打开IntelliJ IDEA软件默认会打开最近一次的 ...

  6. C++ 输出菱形

    输出*号组成的菱形: // print.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <iostream> ...

  7. String_Helper

    #region 扩展验证方法 #region <<IsNullOrEmpty()字符串是否为空>> /// <summary> /// <para>代码 ...

  8. solidity语言11

    函数修饰符 pragma solidity ^0.4.11; contract owned { address owner; // 构造函数 function owned() public { own ...

  9. nagios外部命令接口

    http://nagios.manubulon.com/traduction/docs14en/extcommands.html https://old.nagios.org/developerinf ...

  10. day009-IO流

    什么叫流?就是数据的流动.以内存为基准,分为输入input和输出output.输入也叫做读取数据,输出也叫写出数据. 分类 按数据的流向分: 输入流.输出流 按数据类型分:    字节流.字符流 1. ...