main.js文件添加如下:

new Vue({
router,
render: h => h(App),
data: {
eventHub: new Vue()
}
}).$mount('#app');

父组件:

监听事件:

this.$root.eventHub.$on('cart.add', (target) => {
this._drop(target);
});

子组件:

触发事件:

this.$root.eventHub.$emit('cart.add', event.target);

vue2.0:子组件调用父组件的更多相关文章

  1. vue 子组件调用父组件的方法

    vue中 父子组件的通信: 子组件通过 props: { //子组件中写的. childMsg: { //字段名 type: Array,//类型 default: [0,0,0] //这样可以指定默 ...

  2. Vue 子组件调用父组件 $emit

    <!DOCTYPE html><html>    <head>        <meta charset="utf-8">      ...

  3. Vue子组件调用父组件的方法

    Vue子组件调用父组件的方法   Vue中子组件调用父组件的方法,这里有三种方法提供参考 第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法 父组件 <temp ...

  4. React篇-子组件调用父组件方法,并传值

    react 中子组件调用父组件的方法,通过props: 父组件: isNote(data){} <div className="tabC01"> <FTab ta ...

  5. vue 子组件调用父组件的函数

    子组件调用父组件的函数,使用$emit(eventName,[...args]),触发当前实例上的事件.附加参数都会传给监听器回调. 子组件 <template> <div> ...

  6. react typescript 子组件调用父组件

    //父组件 import * as React from 'react'import { Input } from 'antd'const Search = Input.Searchimport &q ...

  7. Vue中子组件调用父组件的方法

    Vue中子组件调用父组件的方法 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta ...

  8. Vue 子组件调用父组件方法

    父组件内容: <template> <div> <info-wnd ref="infoWnd" @parentClick="wndClick ...

  9. react 子组件调用父组件方法

    import React from 'react'import '../page1/header.css'import { Table } from 'antd'import Child from ' ...

  10. react 父组件调用子组件方法、子组件调用父组件方法

    我们闲话不多说,直接上代码 // 父组件 import React, {Component} from 'react'; class Parents extends Component { const ...

随机推荐

  1. 配置了SSH后还是每次都要求输入密码

    保存凭证可以解决问题 git config --global credential.helper store

  2. java里如何实现循环打印出字符串或字符串数组里的内容

    不多说,直接上干货! java里如何实现循环打印出字符串里的内容 思路:可以先将字符串转换成字符串数组. public class test { public static void main(Str ...

  3. WPF使用Aspose.Words导出Word文档

    一.创建Word文档模板 分析需要导出的word文档,将固定的内容和由程序生成的内容分开; 创建一个word(例如:Template.doc)文档,将固定的内容按照一定的格式写入当前文档中; 打开Te ...

  4. 常见的生成全局唯一id有哪些?他们各有什么优缺点?

    分布式系统中全局唯一id是我们经常用到的,生成全局id方法由很多,我们选择的时候也比较纠结.每种方式都有各自的使用场景,如果我们熟悉各种方式及优缺点,使用的时候才会更方便.下面我们就一起来看一下常见的 ...

  5. 《Head First 设计模式》之装饰者模式——饮料加工

    装饰者模式(Decorator) ——动态地将责任附加到对象上.若要扩展功能,装饰者提供了比继承更有弹性的替代方案. 特点:建立拥有共同超类的装饰者与被装饰者来实现功能的动态扩展 原则:对扩展开放,对 ...

  6. iOS中UIWebview中网页宽度自适应的问题

    有的网页中会使用"<meta name="viewport" content="width=device-width, initial-scale=1.0 ...

  7. Riverbed SteelHead 9.5.0

    平台: scientific linux release 6.5 类型: 虚拟机镜像 软件包: riverbed steelhead 9.5.0 basic software Enterprise i ...

  8. PHP:php遍历数组 foreach echo() list()总结

    php中可以用来遍历数组的方法有很多,如有:foreach语句.list().each(),这几个也是主要的方法,现总结如下: foreach语句遍历数组 foreach语句用于循环遍历数组,每进行一 ...

  9. IOS类似9.png

    图形用户界面中的图形有两种实现方式,一种是用代码画出来,比如Quartz 2D技术,狠一点有OpenGL ES,另一种则是使用图片. 代码画的方式比较耗费程序员脑力,CPU或GPU; 图片则耗费磁盘空 ...

  10. 配置Python环境变量

    虽然是老问题了,现在安装都自动配置环境变量. 这里,我是在VS2017中安装的Python3.6,但是没有自动配置好环境变量. 配置Python环境变量 打开[此电脑]—[属性]—[高级系统设置]—[ ...