<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. Nginx03 虚拟主机

    1 虚拟主机 虚拟主机使用特殊的软硬件技术,把一台运行在因特网上的服务器主机分成一台台"虚拟"的主机,每一台虚拟主机都具有独立的域名,具有完整的Internet服务器(WWW.FT ...

  2. Docker中apt-get update失败解决方案

    一.更换apt的镜像源 1. 进入目录 cd /etc/apt 2. 备份源文件 cp /etc/apt/sources.list /etc/apt/sources.list.bak 3. 更改镜像源 ...

  3. 快速上手Java开发工具Eclipse之简易手册

    Eclipse下载,可以下载最新版本,文档是以2020-12R版本为例 http://www.eclipse.org/downloads/ 下载Packages即可 安装Eclipse 解压安装 除了 ...

  4. nodejs实现保存文件到本地或者服务器

    nodejs如何将前端传递的文件进行保存在本地或者服务器 一.nodejs获取前端传递的文件file有三种,这里我们推荐使用koa-body 1 // 安装依赖 koa-body 2 npm inst ...

  5. try-catch易错分析

    /* * @author YAM */public class Test01 { public static void main(String[] args) { try { showExce(); ...

  6. TNF诱导的关节破坏由IL-1介导

    TNF诱导的关节破坏由IL-1介导Zwerina J, et al. PNAS.2007;104:11742-7.TNF拮抗剂有效抑制人类类风湿关节炎(RA)的炎症和结构破坏.然而截至目前还不清楚TN ...

  7. Postgresql 除法保留小数位

    一.示例 select 8/(100-3) as c1,  round(8/(100-3) ,4) as c2,  round(8/(100-3)::numeric ,4) as c3,  8/(10 ...

  8. offer_48

    题目:写一个函数,求两个整数之和,要求在函数体内不得使用+.-.*./四则运算符号. 思路: /* 首先看十进制是如何做的: 5+7=12,三步走 第一步:相加各位的值,不算进位,得到2. 第二步:计 ...

  9. 数据类型之字符串（string）（二）

    1.字符串索引 name = "Liu Dehua" print(name[0]) 返回结果: 'L' 注意:索引从0开始. 2.反索引--通过字符找位置 name.index(& ...

  10. 【剑指Offer】【栈】栈的压入、弹出序列

    题目:输入两个整数序列,第一个序列表示栈的压入顺序,请判断第二个序列是否可能为该栈的弹出顺序.假设压入栈的所有数字均不相等.例如序列1,2,3,4,5是某栈的压入顺序,序列4,5,3,2,1是该压栈序 ...