<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] 的理解的更多相关文章

  1. Vue中diff算法的理解

    Vue中diff算法的理解 diff算法用来计算出Virtual DOM中改变的部分,然后针对该部分进行DOM操作,而不用重新渲染整个页面,渲染整个DOM结构的过程中开销是很大的,需要浏览器对DOM结 ...

  2. vue中的插槽slot理解

    本篇文章参考赛冷思的个人博客 1.函数默认传参 在我们写js函数我们的可能会给他们一个默认的参数,写法是 function show(age,name){ var age = age || 20; v ...

  3. vue中webpack的配置理解

    当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面  (环境变量及其基本变量的配置) var path = require('path') ...

  4. Vue中keep-alive组件的理解

    对keep-alive组件的理解 当在组件之间切换的时候,有时会想保持这些组件的状态,以避免反复重渲染导致的性能等问题,使用<keep-alive>包裹动态组件时,会缓存不活动的组件实例, ...

  5. vue中mixin的一点理解

    vue中提供了一种混合机制--mixins,用来更高效的实现组件内容的复用.最开始我一度认为这个和组件好像没啥区别..后来发现错了.下面我们来看看mixins和普通情况下引入组件有什么区别?     ...

  6. 关于vue中的nextTick深入理解

    定义[nextTick.事件循环] nextTick的由来: 由于VUE的数据驱动视图更新,是异步的,即修改数据的当下,视图不会立刻更新,而是等同一事件循环中的所有数据变化完成之后,再统一进行视图更新 ...

  7. 摘抄大神对VUE 中slot-scope的深度理解

    Vue的slot-scope的场景的个人理解 这篇文章不是单纯把文档的话和api拿来翻译和演示,而是谈谈我对于slot-scope的使用场景的个人理解,如果理解错误,欢迎讨论! Vue的插槽slot, ...

  8. 理解vue中的scope的使用

    理解vue中的scope的使用 我们都知道vue slot插槽可以传递任何属性或html元素,但是在调用组件的页面中我们可以使用 template scope="props"来获取 ...

  9. 理解Vue中的Render渲染函数

    理解Vue中的Render渲染函数 VUE一般使用template来创建HTML,然后在有的时候,我们需要使用javascript来创建html,这时候我们需要使用render函数.比如如下我想要实现 ...

  10. 【转】简单理解Vue中的nextTick

    前言: Vue中的nextTick涉及到Vue中DOM的异步更新,感觉很有意思,特意了解了一下.其中关于nextTick的源码涉及到不少知识,很多不太理解,暂且根据自己的一些感悟介绍下nextTick ...

随机推荐

  1. [转]Ethereum-智能合约最佳实践

    主要章节如下: Solidity安全贴士 已知的攻击手段 竞态 可重入 交易顺序依赖 针对Gas的攻击 上溢/下溢 工程技术 参考文献 这篇文档旨在为Solidity开发人员提供一些智能合约的secu ...

  2. Django模型model Field详解:

    类型说明 AutoField一个自动增加的整数类型字段.通常你不需要自己编写它,Django会自动帮你添加字段:id = models.AutoField(primary_key=True),这是一个 ...

  3. java 执行jar包里面一个类class文件

    一.环境: 1. linux 2. 有两个java类,A.java和B.java,都在同一个目录下 二.源码: A.java   package com.abc;   public class A { ...

  4. css 属性值 calc (目前只了解部分)

    移动端页面,有如下图的需求: 实现效果: 实现 css 代码: .list {/*父级*/ border: 1px solid #E9EAEA; border-radius: 2px; backgro ...

  5. Dubbo教程:入门到实战

    Dubbox简介 Dubbox 是一个分布式服务框架,其前身是阿里巴巴开源项目Dubbo ,被国内电商及互联网项目中使用,后期阿里巴巴停止了该项目的维护,当当网便在Dubbo基础上进行优化,并继续维护 ...

  6. C++学会STL

    1.1 泛型程序设计简介 泛型程序设计,简单地说就是使用模板的程序设计法.将一些常用的数据结构(比如链表,数组,二叉树)和算法(比如排序,查找)写成模板,以后则不论数据结构里放的是什么对象,算法针对什 ...

  7. 【代码审计】PHPCMS2008任意代码执行漏洞

    很老的漏洞了,但很经典~ 在 phpcms2008/include/global.func.php eval  可以执行命令 在这里我们看一下是谁调用 跟进string2array函数 yp/web/ ...

  8. windows 配置hadoop环境

    在idea运行spark程序的时候报错:java.io.IOException: Could not locate executable null\bin\winutils.exe in the Ha ...

  9. mysql数据库关系表设计原则

    三范式https://blog.csdn.net/qq_36432666/article/details/78934073 https://kb.cnblogs.com/page/138526/ ht ...

  10. MSP430 CCS6.2无法启动仿真

    前几天在淘宝买了个msp430的仿真器 因为熟悉eclipse的开发环境,所以选择用ccs6.2进行开发 拿到手的时候,仿真器的固件是v2版本的 对新版本的iar和ccs都不支持 随后我使用Lite ...