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 ...
随机推荐
- ACM-ICPC实验室20.2.19测试-图论
B.Harborfan的新年拜访Ⅱ 就是一道tarjan缩点的裸题. 建图比较麻烦 以后遇到这种建图,先用循环把样例实现出来,再对着循环写建图公式 #include<bits/stdc++.h& ...
- STM32 MDK C 常见易错点
1.MDK编译器单字节的负数-1,-2,-3... ... 处理:存储,类型转换,位对齐. char 定义的变量在运算过程尤其类型转换,逻辑比大少会被当做 unsigned char 处理,这里很容易 ...
- IDEA部署项目,并结合Shell脚本运行Java程序
一.概述 在实际开发中,我们写好的代码,往往打成war包或jar包,通过winscp或其他软件将其上传至服务器,然而这样非常大的一个弊端就是不利于开发,为什么这么说呢?假如我们刚刚将springboo ...
- P1047
题目不难...但坑得是数据大小..N 的大小越大越好... #include <bits/stdc++.h> #include <cstdio> #include <cm ...
- Ubuntu国内镜像
编辑文件:sudo vim /etc/apt/sources.list 全部替换为:如下根据需要替换一个即可,修改保存后记得要执行更新软件包列表命令: sudo apt-get update 一.清华 ...
- 测试环境docker-swarm安装部署
测试环境swarm安装部署 部署前增加监听docker2375端口 centos 增加tcp监听端口 修改/lib/systemd/system/docker.service sed -i ‘s/Ex ...
- numpy常用函数之arange函数
2.np.arange([start, ]stop, [step, ]dtype=None) 作用: arange函数用于创建等差数组 start:可忽略不写,默认从0开始;起始值 stop:结束 ...
- Doc-Compose
一.安装sudo curl -L https://github.com/docker/compose/releases/download/1.24.1/docker-compose-`uname -s ...
- 802.1X高级配置
部署VLAN和ACLCisco Catalyst交换机(认证方)和Cisco ACS(认证服务器)具备动态分配VLAN或者ACL的能力.Cisco ACS可以将某个用户分配给指定的VLAN,或应用AC ...
- LeetCode中等题(三)
题目一: 反转从位置 m 到 n 的链表.请使用一趟扫描完成反转. 说明:1 ≤ m ≤ n ≤ 链表长度. 示例: 输入: 1->2->3->4->5->NULL, m ...