最近在看其他项目的过程中,发现在dom节点上使用了ref="xxx"的使用,以前一直不知道该属性起着什么作用,因为一直忙着写项目.

这两天项目不忙了,有闲心来看别人做的项目了,就看到这个用法了,还是直接百度,有很多解释,大致的意思就是给dom节点绑定一个值value,将这个value值存储到vue的节点管理器refs中,后续要找到这个节点的话,直接调用$refs.value就可以找到这个节点了,我去,太方便了,傻傻的我之前要么自己写id,然后使用document.getElementById来获取,要么直接用jquery,简直是丧心病狂,为了获取节点方便竟然不惜牺牲性能使用jquery,想想真的太水了.还好及时发现了这个方法,以后还是得多通读官方api文档啊.

vue中refs的使用的更多相关文章

  1. vue中$refs的使用

    vue中$refs获取组件或元素: 获取的元素就相当于是一个原生获取的元素,可以进行操作 this.$refs.ele.style.color = 'red

  2. vue中$refs、$slot、$nextTick相关的语法

    Vue 实例还暴露了一些有用的实例属性与方法.它们都有前缀 $,以便与用户定义的属性区分开来 1.$data和$el var data = { a: 1 } var vm = new Vue({ el ...

  3. Vue中$refs的用法

    说明:vm.$refs 一个对象,持有已注册过 ref 的所有子组件(或HTML元素) 使用:在 HTML元素 中,添加ref属性,然后在JS中通过vm.$refs.属性来获取 注意:如果获取的是一个 ...

  4. vue中\$refs、\$emit、$on的使用场景

    1.$emit的使用场景 子组件调用父组件的方法并传递数据注意:子组件标签中的时间也不区分大小写要用“-”隔开 子组件: <template> <button @click=&quo ...

  5. vue中$refs的用法及作用详解

    一般来讲,获取DOM元素,需要使用document.querySelector('#input1')方法去获取dom节点,然后再获取input1的值. 但是使用了ref绑定之后,我们就不需要再获取do ...

  6. vue中$refs、,$emit、$on

    $emit https://blog.csdn.net/sllailcp/article/details/78595077 $on https://www.jianshu.com/p/a544728b ...

  7. vue中 $refs的基本用法

    骚年,我看你骨骼惊奇,有撸代码的潜质,这里有324.57GB的前端学习资料传授于你!什么,你不信??? 先随便看几个图: 肯定没看够.再来个GIF图热个身??? 那么问题来了,如果你也想入坑前端或者学 ...

  8. Vue 中的 ref $refs

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

  9. 【Vue】Vue中的父子组件通讯以及使用sync同步父子组件数据

    前言: 之前写过一篇文章<在不同场景下Vue组件间的数据交流>,但现在来看,其中关于“父子组件通信”的介绍仍有诸多缺漏或者不当之处, 正好这几天学习了关于用sync修饰符做父子组件数据双向 ...

随机推荐

  1. KMP算法详解&&P3375 【模板】KMP字符串匹配题解

    KMP算法详解: KMP算法是一种改进的字符串匹配算法,由D.E.Knuth,J.H.Morris和V.R.Pratt(雾)提出的. 对于字符串匹配问题(such as 问你在abababb中有多少个 ...

  2. 同一电脑如何安装多个jdk

    1.安装对应的jdk 本机测试只安装jdk1.7和1.8 2.切换jdk 以我的环境为例,一开始装的是jdk1.7,要切换到jdk1.8时,需修改以下内容 环境变量,该为对应jdk的bin路径 修改注 ...

  3. Array 对象-sort()

    Array 对象-sort() sort方法对数组成员进行排序,默认是按照字典顺序排序.排序后,原数组将被改变. sort方法不是按照大小排序,而是按照字典顺序.也就是说,数值会被先转成字符串,再按照 ...

  4. 搭建私有CA

    一.实验目的 搭建私有CA并使其可以实现公司内部的的签名服务. 二.实验环境: 系统架构:Centos7(服务器).Centos6(需要申请证书的服务器)需要的软件包:openssl.openssl- ...

  5. top命令参数详解

    简介 top命令是Linux下常用的性能分析工具,能够实时显示系统中各个进程的资源占用状况,类似于Windows的任务管理器. top显示系统当前的进程和其他状况,是一个动态显示过程,即可以通过用户按 ...

  6. 关于HTML5视频标签的问题

    一.基本 video标签在兼容性上还是比较差的,如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8的(Opera.Mozilla.Chrome),支持H.264的( ...

  7. 使用idea 搭建一个 SpringBoot + Mybatis + logback 的maven 项目

    (注意项目名不能有大写......),把项目类型 改成 War 类型.(web项目) 使用 mybatis-generator 插件 生成 实体类 和 接口 在 resources 目录 中 新建一个 ...

  8. .md(markdown)基础语法

    markdown基础语法笔记,方便翻看. 1. 标题 标题有3中写法,可混写: (1)# ***,前面#,后面文字,注意,#与文字间有空格,1-6个#分别表示h1-h6,h1.h2下有横线 (2)== ...

  9. JAVA8之日期操作详解

    package org.date; import java.time.DayOfWeek; import java.time.LocalDate; import java.time.Month; im ...

  10. Oracle之：Function ：strFormatDate()

    create or replace function strFormatDate(i_datestr in varchar2) return date is begin if i_datestr is ...