大概很多人都知道用这个,网上教程也一大堆,但我想说的是一定要手动敲一遍,敲一遍,敲一遍,重要的事情说三遍。

大概有些人也不知道它该何时用on,或者emit 的吧?

先说两个我项目中用到的场景吧:

  • 项目的公共header,需要动态变化标题,那公共header就作为一个子组件而存在,不同的父组件传入不同的title,此时用到on ,父给子传值。
  • 顶部的登录点开之后,是内容,想通过内容点击之后关闭弹窗,并且不影响下次登录。

vue on emit 父子之间传值应用详细代码的更多相关文章

  1. vue 父子之间传值

    1:父组件 子组件 子组件利用 props 接收父级传过来的数值.子组件选中的数值返回父亲当中利用 钩子函数 $emit('函数名',传过去的数值)  

  2. vue全局组件-父子组件传值

    全局组件注册方式:Vue.component(组件名,{方法}) demo: 子组件:upload.vue <template> <div > <div class=&q ...

  3. vue的prop父子组件传值

    props down, events up 父组件通过 props 向下传递数据给子组件:子组件通过 events 给父组件发送消息. 静态 props 要让子组件使用父组件的数据,需要通过子组件的 ...

  4. react父子之间传值

    1,父组件向子组件传值 2.子组件向父组件传值 3.没有嵌套关系的组件传值 // 父组件 var MyContainer = React.createClass( { getInitialState: ...

  5. Vue组件传值(二)之 非父子组件传值

    Vue中非父子组件之间是如何实现通信的? 本章主要讲的是非父子组件传值,父子组件传值请看上一篇文章. 1.创建新的Vue实例引入项目中,通过$emit.$on来实现非父子组件传值: 1 <!DO ...

  6. vue父子组件之间传值

    vue父子组件进行传值 vue中的父子组件,什么是父组件什么是子组件呢?就跟html标签一样,谁包裹着谁谁就是父组件,被包裹的元素就是子组件. 父组件向子组件传值 下面用的script引入的方式,那种 ...

  7. vue的$emit 与$on父子组件与兄弟组件的之间通信

    本文主要对vue 用$emit 与 $on 来进行组件之间的数据传输. 主要的传输方式有三种: 1.父组件到子组件通信 2.子组件到父组件的通信 3.兄弟组件之间的通信 一.父组件传值给子组件 父组件 ...

  8. angularjs $emit $on $broadcast 父子 兄弟之间传值

    父子之间 <div ng-controller="ParentCtrl"> <div ng-controller="ChildCtrl"> ...

  9. Vue(2)- v-model、局部组件和全局组件、父子组件传值、平行组件传值

    一.表单输入绑定(v-model 指令) 可以用 v-model 指令在表单 <input>.<textarea> 及 <select> 元素上创建双向数据绑定. ...

随机推荐

  1. 05、python的基础-->字典的增、删、改、查

    1.字典的增 dict = {'age':19,'name':'老王','hobby':'girl'} dict['sex'] = 'boy' #没有键值对,直接添加 dict[' #有键值对,覆盖值 ...

  2. python_模块 collections,random

    collections模块 在内置数据类型(dict.list.set.tuple)的基础上,collections模块还提供了几个额外的数据类型:Counter.deque.defaultdict. ...

  3. shell数组变量

  4. 笔记64 Spring Boot快速入门(四)

    SpringBoot中错误处理.端口设置和上下文路径以及配置切换 一.错误处理 假设在访问首页的时候会出现一些错误,然后将这些错误当作异常抛出,反馈给用户. 1.修改IndexController.j ...

  5. Linux编译C语言程序

    1.首先安装gcc包,运行C++程序,安装gcc-c++ 包 如果没有安装的自行进行安装 2.编辑C语言程序, 打印乘法口诀表 [root@Db1 c]# vim chengfa.c 在编辑界面中,输 ...

  6. jquery实现表格复选框---多行选择问题(php变量)

    1.html多选框标签行 表头的多选框,用于全选,取消全选 <th><input id='allSelected' type="checkbox">< ...

  7. leetcode-13双周赛-1257-最小公共区域

    题目描述: 方法: class Solution(object): def findSmallestRegion(self, regions, region1, region2): parent = ...

  8. “二维数组”?

    首先说明C中是不存在所谓的"多维数组"的. int array[a][b]:声明的是一个有a个元素的数组,每个数组元素是一个含b个元素的数组. 上述声明正确的说法是,数组的数组. ...

  9. MaxCompute新功能发布

    2018年Q3 MaxCompute重磅发布了一系列新功能. 本文对主要新功能和增强功能进行了概述. 实时交互式查询:Lightning on MaxCompute 生态兼容:Spark on Max ...

  10. linux IPC 消息队列

    消息队列函数原型 在建立IPC通讯时(如消息队列,共享内存)必须建立一个ID值.通常情况下,这个ID值由ftok函数得到 #inlcude <sys/types.h> #include & ...