<div class="myClass" ref="diva"></div> // 给dom节点添加ref

this.$refs.diva.style.color = 'red';  // 通过ref直接获取元素属性并修改

也可以通过给组件添加ref来引用组件。

直接使用组件里的方法和数据

vue ref用法的更多相关文章

  1. Vue props用法详解

    Vue props用法详解 组件接受的选项之一 props 是 Vue 中非常重要的一个选项.父子组件的关系可以总结为: props down, events up 父组件通过 props 向下传递数 ...

  2. 【vue】vue中ref用法

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

  3. Vue $ref 的用法

    <div id="app"> <cpn $ref="item"></cpn> <cpn></cpn> ...

  4. vue better-scroll用法

    滚动位置固定:在vue中通过路由切换页面时组件会自动滚动到顶部,需要监听滚动行为才能让滚动位置固定,better-scroll解决了这个问题. 常用效果:移动端很常见的效果,当滑动右边部分的时候,左边 ...

  5. vue setTimeout用法 jquery滚动到某一个div的底部

    //vue 中setTimeOut用法 var $this = this; setTimeout(function(){ $this.goEnd() }, 10); goEnd:function(){ ...

  6. Vue.js用法详解（一）更新中~

      前  言 前段时间为了一个数据查询的项目自学了Vue,感觉这款框架还是很不错的,今天就整理整理这个框架如何使用,希望对正在学这个框架的小伙伴有所帮助~ 首先,我们先来了解一下Vue: Vue.js ...

  7. vue$ref

    vue的$ref方法 可以在元素上template中直接添加ref属性 类似html的id属性 用来做选项卡的切换的

  8. vue之用法

    一.安装 对于新手来说,强烈建议大家使用<script>引入 二. 引入vue.js文件 我们能发现,引入vue.js文件之后,Vue被注册为一个全局的变量,它是一个构造函数. 三.使用V ...

  9. Vue 基本用法

    Vue的基本用法 模板语法{{ }} 关闭掉 django中提供的模板语法{{ }} 指令系统 v-text v-html v-show和v-if v-bind和v-on v-for v-model ...

  10. Vue基本用法

    在学习Vue的基本用法之前,我们先简单的了解一些es6的语法 let: 特点:1.局部作用域 2.不会存在变量提升 3.变量不能重复声明 const: 特点:1.局部作用域 2.不会存在变量提升 3. ...

随机推荐

  1. Nginx04 反向代理和负载均衡

    1 反向代理介绍 https://www.cnblogs.com/jthr/p/16827214.html 2 负载均衡介绍 https://www.cnblogs.com/jthr/p/168273 ...

  2. c++标准库string的使用完美总结——十分详细，复习学习记忆都可以使用

    std::string详解 之所以抛弃char*的字符串而选用C++标准程序库中的string类,是因为他和前者比较起来,不必 担心内存是否足够.字符串长度等等,而且作为一个类出现,他集成的操作函数足 ...

  3. 一牛X同学的报告分享

    https://indico.cern.ch/event/743699/contributions/3072640/attachments/1750517/2836233/ARIES_Workshop ...

  4. 微信小程序-支付

    微信小程序的支付只要用到官方的支付API : wx.requestPayment(Object object) 官方文档地址:https://developers.weixin.qq.com/mini ...

  5. Cesium 椭球大地测量EllipsoidGeodesic(十二)

    首先发现一个问题,这段代码会报错,原因是"DeveloperError: Expected value to be greater than or equal to0.0125, actua ...

  6. 【NOIP2013提高组】华容道

    分析 一个比较显然的方式是 设 \(f_{i,j,x,y}\) 表示达到空格所处位置为 \((i,j)\) 且特殊格位置为 \(x,y\) 的状态的最少步数 一次可以交换空格和相邻格,代价为 \(1\ ...

  7. 脊柱关节病外周关节滑膜高表达的RANK/RANKL/OPG系统与炎症呈部分分离

    脊柱关节病外周关节滑膜高表达的RANK/RANKL/OPG系统与炎症呈部分分离Vandooren B, et al. Arthritis Rheum. 2008;58:718-729目的:脊 柱关节病 ...

  8. php链接access并查询列出

    <?php$odbc = "Driver={Microsoft Access Driver (*.mdb)};Dbq=".realpath("db.mdb" ...

  9. [NPUCTF2020]认清形势，建立信心

    [NPUCTF2020]认清形势,建立信心 题目 from Crypto.Util.number import * from gmpy2 import * from secret import fla ...

  10. ChatGPT is at capacity right now.ChatGPT Plus subscriber login Add your email for a personalized login link的解决办法

    原因 你的ip地区用的人过多. 解决办法 在右侧页面填入邮箱,能收到邮件立刻就能登录,如果没有,就换地区试试,不行就等等吧 邮件示例: