最近看别人的项目发现有些语法不能理解，所以百度进行了学习。现在总结一下。

ref 有两种用法

1.ref 加在普通的元素上，用this.ref.name 获取到的是dom元素

2.ref 加在子组件上，用this.ref.name 获取到的是组件实例，可以使用组件的所有方法。

3.如何利用v-for 和ref 获取一组数组或者dom 节点

vue 中ref 的使用注意事项的更多相关文章

  1. Vue.js-11：第十一章 - Vue 中 ref 的使用

    一.前言 在之前的前端开发中,为了实现我们的需求,通常采用的方案是通过 JS/Jquery 直接操纵页面的 DOM 元素,得益于 Jquery 对于 DOM 元素优异的操作能力,我们可以很轻易的对获取 ...

  2. 【vue】vue中ref用法

    1.获取当前元素: 例子: <div class="pop pos-a" :style="{ left: pop_x + 'px' ,top: pop_y + 'p ...

  3. vue中$ref的基本用法

    1.使用在一般的标签上 <div id="app"> <input ref="count" type="text" v-m ...

  4. 17、前端知识点--Vue中ref的使用

    methods里面的方法,需要手动触发才会执行. 如果想让页面一上来就执行的话,就需要写在mounted这个钩子函数中. <body> <div id="app" ...

  5. Vue中 $ref 的用法

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

  6. Vue中改变对象的注意事项

    数组更改注意事项 Vue无法检测到以下方式变动的数组 当你利用索引直接设置一个项时,例如:vm.items[index] = newValue 当你修改数组的长度时,例如:vm.items.lengt ...

  7. vue中ref在input中详解

    当我们在项目中遇见文本输入框的时候,获取时刻输入框中的值 1.v-model <template> <input type="text" v-model=&quo ...

  8. vue中ref的使用（this.$refs获取为undefined）

    如果你获取到的总是空的,你注意一下: 1.你在哪里调用,和你调用的对象 试试在mounted()里面调用有效果没有 调用的对象是本来就存在的,还是需要数据渲染之后才会出现的,同理,在mounted() ...

  9. vue中操作Dom节点的方法

    1.vue中ref操作dom节点 <template> <div id="app"> <div </div> <button @cl ...

随机推荐

  1. mybatis第二天——动态SQL与关联查询

    大纲摘要: 1.输入映射和输出映射 a) 输入参数映射 b) 返回值映射 2.动态sql a) If b) Where c) Foreach d) Sql片段 3.关联查询 a) 一对一关联 b) 一 ...

  2. JavaWeb总结（十一）

    JSP简介 虽然Servlet解决了传统CGI编程的缺陷,但是它并不一定是最高效率的方案 - Servlet的编码.部署和调试任务繁琐 - 生成动态网页繁琐,不利于项目分工 为了弥补Servlet这些 ...

  3. jQuery学习- 子选择器与可见性选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. 1o xiaomi

    atom 取色器   div.contine  tab 补齐

  5. 运行用例时，报错Unknow Error：Element xxx is not clickable……的解决方法

    P.S:近期selenium官方更新了版本以解决此问题 通常这种情况是由于在点击该元素时,js更换了元素属性造成的. 所以可以采用js的方式进行处理 方法如下: WebDriver driver = ...

  6. 大话 .Net 之内存管理

    在一次偶然的机会中,我来到了恒生的大家庭.又在一次偶然的机会中,我很荣幸的被勇哥信任并让我写一篇季刊的文章.可能人生之中充满了无数次的偶然机会,我们只有抓住眼前的“偶然”,才可以创建人生.当我接到这个 ...

  7. 41F继电器座的解剖与妙用

    摘要:如果继电器不是焊在电路板上使用,就需要有个插座,这样方便接线,否则继电器的管脚是没法固定导线的.实际项目中使用了HF41F的继电器(宏发),在选择继电器座的时候,有一点感想,分享给大家.继电器是 ...

  8. Python读取文件编码解码问题

    用chardet检测编码 import chardet raw = open("model.json", 'rb').read() result = chardet.detect( ...

  9. SQL注入原理&分类&危害&防御

    SQL是什么? 结构化查询语句 SQL注入是什么? 是一种将SQL 语句插入或添加到用户输入的参数中,这些参数传递到后台服务器,加以解析并执行 造成注入的原因/原理? 1.对用户输入的参数没有进行严格 ...

  10. 【转】phpcms v9的ckeditor加入给内容调整行高

    今天公司一客户要求一同事给ckeditor加入可以设置行高的功能(他后台是用织梦做的,他是织梦的FANS),我一时闲得慌,也想给咱家的v9加入这个功能,功夫不负有心啊,终于成功了,来给大家分享一下! ...