<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. P29_全局配置 - window - 导航栏

    window 了解 window 节点常用的配置项 设置导航栏的标题 设置步骤:app.json -> window -> navigationBarTitleText 需求:把导航栏上的 ...

  2. React中组件之间是如何通信的 react的组件通信方式有哪些

    一.是什么 通信指的是发送者通过某种媒体 以某种格式来传递信息 到收信者以达到某个目的,广义上,任何信息的传递都是通信 二.如何通信? 组件传递的方式有很多种,根据传送者和接收者可以分为如下: 父组件 ...

  3. 图解论文《The Part-Time Parliament》

    本文以图文并茂的方式重新演绎 Paxos 开山之作 <The Part-Time Parliament>[1],并尝试解释原论文中语焉不详的地方. 背景 在 Paxos 小岛上,施行着一种 ...

  4. Vulhub 漏洞学习之：ElasticSearch

    Vulhub 漏洞学习之:ElasticSearch 目录 Vulhub 漏洞学习之:ElasticSearch 1 ElasticSearch 命令执行漏洞(CVE-2014-3120)测试环境 1 ...

  5. select去除默认样式

    select { /*Chrome同Firefox与IE里面的右侧三角显示的样式不同*/ border: solid 1px #ddd; /*将默认的select选择框样式清除*/ appearanc ...

  6. 【javascript】slice()、substring()和substr() 三种字符串截取方法区别

    slice(start, end) :slice(start, end) 方法可提取字符串的某个部分,并以新的字符串返回被提取的部分.  1.start(包含) 和 end(不包含) 参数来指定字符串 ...

  7. 3. 贪心思想(todo)

    目录 1. 分配饼干 2. 不重叠区间个数 3. 投飞镖刺破气球 5. 买卖股票最大的收益 6. 买卖股票的最大收益 II 9. 修改一个数成为非递减数组 10. 子数组的最大和 11. 分隔字符串使 ...

  8. 关于MFC程序关闭之后仍有线程存留

    最近弄了一个项目,关闭之后在任务管理器中依然存留,刚开始以为是因为子线程没能退出,就用ExitThread来终止,终止之后发现好像并不是子线程的原因 查了好久没能找到原因 最后只能通杀 HANDLE ...

  9. 2.3 在DispatcherServlet的构造方法中解析applicationContext.xml配置文件

    package com.hy.servlet; import java.io.IOException; import java.io.InputStream; import java.util.Map ...

  10. disabled属性的简介和使用

    一.disabled属性的简介和使用 Html中的input元素.button元素.option元素等都具有一个disabled属性. disabled对a标签不起作用当赋予该属性时该元素将变得不可交 ...