父访问子  (需要掌握)

this.$children 和 this.$refs

this.$children 返回的是一个数组,包含父组件的所有子组件  this,$refs 返回的是一个对象,默认为空,返回父组件中所有标签带有ref属性的子组件

this.$children 是获取父组件的所有子组件,然后返回一个数组   (不常用)
this.$refs 则是通过给 组件标签上 加上一个 ref属性,然后在父组件中调用 this.$refs时才会返回 一个对象  (常用,用的非常多 基本都是用这个)
例如  子组件标签 <cpn ref="mm"></cpn>   通过this.$refs 他就会返回一个对象 {mm:Vuecomponent} 而mm就作为一个key,我们通过this.$refs.mm 就能拿到这个组件,之后就可以拿到具体的值了

访问父   (不常用)

this.parent 访问父组件   this.root 访问根组件   (都用得少)

vue的父与子组件的访问的更多相关文章

  1. Vue.js父与子组件之间传参

    父向子组件传参 例子:App.vue为父,引入componetA组件之后,则可以在template中使用标签(注意驼峰写法要改成componet-a写法,因为html对大小写不敏感,component ...

  2. 【vue】父向子组件传参、子组件向父传参

    1.父向子组件传参 App.vue为父,引入componetA组件之后,则可以在App.vue中使用标签(注意驼峰写法要改成componet-a写法,因为html对大小写不敏感,componenta与 ...

  3. vue 父向子组件传递数据,子组件向父组件传递数据方式

    父组件向子组件传递数据通过props,子组件引入到父组件中,设置一个值等于父组件的数据,通过:bind将数据传到子组件中,子组件中通过props接收父组件的数据,这样就可以使用父组件的数据了,循环组件 ...

  4. 深度剖析Vue中父给子、子给父、兄弟之间传值!

    本片文章将为您详细讲解在Vue中,父给子传值.子给父传值以及兄弟之间传值方式! 父传子:父组件 // template里面 <aa :info="name"/> // ...

  5. vue 项目, 通知子组件更新,父组件中每次点击按钮重新加载子组件,(重新生成dom 元素)

    vue是组件化开发的项目,很多情况下会把公共组件提取出来,来减少代码量,提高开发效率,和以后更好的可维护性.很多情况下,父组件中都会引用子组件这种情况.通过给在父组件中引用的子组件标签上添加属性,来渲 ...

  6. vue $emit $on 从子组件传递数据给父组件

    原理是: 子组件使用$emit发送数据,父组件使用$on,或者v-on绑定, 来监听子组件发送的数据. 子组件: <button @click="sendChildData" ...

  7. Vue(13)子组件与父组件超详细解析

    父组件和子组件 我们经常分不清什么是父组件,什么是子组件.现在来简单总结下:我们将某段代码封装成一个组件,而这个组件又在另一个组件中引入,而引入该封装的组件的文件叫做父组件,被引入的组件叫做子组件.具 ...

  8. vue 中 echart 在子组件中只显示一次的问题

    问题描述 一次项目开发过程中,需要做一些图表,用的是百度开源的 echarts. vue推荐组件化开发,所以就把每个图表封装成子组件,然后在需要用到该图表的父组件中直接使用. 实际开发中,数据肯定都是 ...

  9. 总结vue中父向子,子向父以及兄弟之间通信的几种方式

    子向父方式1:通过props,如例子中子组件test1.vue向父组件App.vue传值 App.vue代码 <template> <div id="app"&g ...

随机推荐

  1. POJ 1664 放苹果 (递推思想)

    原题链接:http://poj.org/problem?id=1664 思路:苹果m个,盘子n个.假设 f ( m , n ) 代表 m 个苹果,n个盘子有 f ( m , n ) 种放法. 根据 n ...

  2. Fio使用和结果分析

    感谢,参考自:https://blog.51cto.com/qixue/1906768: 官方说明文档,很有用:https://fio.readthedocs.io/en/latest/index.h ...

  3. azure django bug

    azure web app service azure web app service无法部署dhango网站 本地服务器测试代码 实际azure测试 django service 没有部署选项,需要 ...

  4. gorm创建记录及设置字段默认值

    package main import ( "database/sql" "gorm.io/driver/mysql" "gorm.io/gorm&q ...

  5. 查看WordPress网站使用的主题和插件

    阅读原文 whatwpthemeisthat.com 很多时候在网上看到某个WordPress的主题很漂亮,很想要这个主题,又联系不上博客的联系人的时候,我们可以通过以下方法进行查看. 一.手动扒代码 ...

  6. QPS、TPS、并发用户数、吞吐量

    1.QPS QPS Queries Per Second 是每秒查询率 ,是一台服务器 每秒能够相应的查询次数,是对一个特定的查询服务器在规定时间内 所处理流量多少的衡量标准, 即每秒的响应请求数,也 ...

  7. java 变量的定义 类型转换 基本的数据类型

    package com.aaa.zxf.ajax.test; import org.junit.Test; /** * 六. * 如何在ideal的maven项目中导入 Test 测试类? * * * ...

  8. checklist 编写指南

    checklist 编写工具 checklist文档格式推荐使用思维导图.比如 MindMaster 和 processon.我喜欢用这些平台或者软件的思维导图大纲模式来编写 checklist. c ...

  9. 社交网络分析的 R 基础:(三)向量、矩阵与列表

    在第二章介绍了 R 语言中的基本数据类型,本章会将其组装起来,构成特殊的数据结构,即向量.矩阵与列表.这些数据结构在社交网络分析中极其重要,本质上对图的分析,就是对邻接矩阵的分析,而矩阵又是由若干个向 ...

  10. Swift字符串的介绍

    字符串的介绍 字符串在任何的开发中使用都是非常频繁的 OC和Swift中字符串的区别 在OC中字符串类型时NSString,在Swift中字符串类型是String OC中字符串@"" ...