vue中 el [$el] 的理解
<template>
<div class="a">
<div class="basic" ref="ba">基本元素</div>
<chil ref="ccd"></chil>
</div>
</template>
<script>
import Chil from '.../chil.vue'
export default {
name: 'Ba',
components: { Chil }
}
</script>
一个组件里访问基本元素可以用 this.$refs.xxx ,如果要访问子组件要用 this.$refs.xxx.$el
this.$refs.ba.style = "color: red" ---------- this.$refs.ccd.$el.style = "color: red"


vue中 el [$el] 的理解的更多相关文章
- Vue中diff算法的理解
Vue中diff算法的理解 diff算法用来计算出Virtual DOM中改变的部分,然后针对该部分进行DOM操作,而不用重新渲染整个页面,渲染整个DOM结构的过程中开销是很大的,需要浏览器对DOM结 ...
- vue中的插槽slot理解
本篇文章参考赛冷思的个人博客 1.函数默认传参 在我们写js函数我们的可能会给他们一个默认的参数,写法是 function show(age,name){ var age = age || 20; v ...
- vue中webpack的配置理解
当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面 (环境变量及其基本变量的配置) var path = require('path') ...
- Vue中keep-alive组件的理解
对keep-alive组件的理解 当在组件之间切换的时候,有时会想保持这些组件的状态,以避免反复重渲染导致的性能等问题,使用<keep-alive>包裹动态组件时,会缓存不活动的组件实例, ...
- vue中mixin的一点理解
vue中提供了一种混合机制--mixins,用来更高效的实现组件内容的复用.最开始我一度认为这个和组件好像没啥区别..后来发现错了.下面我们来看看mixins和普通情况下引入组件有什么区别? ...
- 关于vue中的nextTick深入理解
定义[nextTick.事件循环] nextTick的由来: 由于VUE的数据驱动视图更新,是异步的,即修改数据的当下,视图不会立刻更新,而是等同一事件循环中的所有数据变化完成之后,再统一进行视图更新 ...
- 摘抄大神对VUE 中slot-scope的深度理解
Vue的slot-scope的场景的个人理解 这篇文章不是单纯把文档的话和api拿来翻译和演示,而是谈谈我对于slot-scope的使用场景的个人理解,如果理解错误,欢迎讨论! Vue的插槽slot, ...
- 理解vue中的scope的使用
理解vue中的scope的使用 我们都知道vue slot插槽可以传递任何属性或html元素,但是在调用组件的页面中我们可以使用 template scope="props"来获取 ...
- 理解Vue中的Render渲染函数
理解Vue中的Render渲染函数 VUE一般使用template来创建HTML,然后在有的时候,我们需要使用javascript来创建html,这时候我们需要使用render函数.比如如下我想要实现 ...
- 【转】简单理解Vue中的nextTick
前言: Vue中的nextTick涉及到Vue中DOM的异步更新,感觉很有意思,特意了解了一下.其中关于nextTick的源码涉及到不少知识,很多不太理解,暂且根据自己的一些感悟介绍下nextTick ...
随机推荐
- C语言:将3*5矩阵中第k列的元素左移到第0列,第k列以后的每列元素依次左移,原来左边的各列依次绕到右边。-在m行m列的二维数组中存放如下规律的数据,
//将3*5矩阵中第k列的元素左移到第0列,第k列以后的每列元素依次左移,原来左边的各列依次绕到右边. #include <stdio.h> #define M 3 #define N 5 ...
- SQLite - C/C++接口 API(一)
1.sqlite3_open(const char *filename, sqlite3 **ppDb) 该例程打开一个指向 SQLite 数据库文件的连接,返回一个用于其他 SQLite 程序的数据 ...
- SQLite3创建表及操作
SQLite 创建表 SQLite 的 CREATE TABLE 语句用于在任何给定的数据库创建一个新表.创建基本表,涉及到命名表.定义列及每一列的数据类型. 语法 CREATE TABLE 语句的基 ...
- 【JavaWeb】Spring相关错误记录
Exception in thread "main" org.springframework.beans.factory.BeanDefinitionStoreException: ...
- 顾家办公两不误,容智ibot帮你实现高效居家办公
春节假期结束,大部分企业已陆续开始复工.经调查显示,受新型冠状病毒疫情影响,不少企业开放了员工“在家办公“模式,就此,员工被动“SOHO”,在家办公火了. 2020 在家办公靠谱吗?会不会成为未来的趋 ...
- 添加安卓端的User-Agent
将系统换为Android即可 随机UA UA分析网站 Mozilla/5.0 (Windows NT 6. 4; WOW64) AppleWebKit/537. 36 (KHTML, like Gec ...
- 理解Linux内核注释
内核是Linux的心脏,它是在引导时装入的程序,用来提供用户层程序和硬件之间的接口,执行发生在多任务系统中的实际任务转换,处理读写磁盘的需求,处理网络接口,以及管理内存.一般情况下,自动安装的内核无需 ...
- 27 JavaScript的引入&注释&弹窗&变量常量&数据类型及转换&内存&垃圾回收
JS的引入: 1 内部引入 绑定元素事件如onclick="" 绑定锚点如href="JavaScript:void(0)" script标签引入,注意:如果标 ...
- PCSearch
1.hinstance:GetModuleHandle(NULL) 2.窗口直角: 方法1:在Oncreate函数中添加以下代码,然而这种方法会导致窗口阴影无效 LONG styleValue = : ...
- 前缀和-Big Water Problem (牛客)
链接:https://ac.nowcoder.com/acm/problem/15164 题目描述 给一个数列,会有多次询问,对于每一次询问,会有两种操作: 1:给定两个整数x, y, 然后在原数组的 ...