父组件通过props向子组件传递数据，子组件通过自定义事件向父组件传递信息。

在子组件中通过$emit触发事件，父组件在直接使用子组件的地方使用v-on(即@)来监听子组件触发的事件。

举例：（不知道怎么设置上传的图片，看不清的话，大家可以放大浏览器：ctrl+鼠标滚动）

子组件：

父组件：

vue--组件中的自定义事件的更多相关文章

  1. vue组件中—bus总线事件回调函数多次执行的问题

    在利用vue组件进行事件监听时发现,如果对N个vue组件实例的bus总线绑定同一事件的回调函数,触发任意组件的对应事件,回调函数至少会被执行N次,这是为什么呢? 为此,调研了普通对象的事件绑定和触发实 ...

  2. 15.Vue组件中的data

    1.组件中展示数据和响应事件: // 1. 组件可以有自己的 data 数据 // 2. 组件的 data 和 实例的 data 有点不一样,实例中的 data 可以为一个对象 // 3. 但是组件中 ...

  3. 使用VUE组件创建SpreadJS自定义单元格(二)

    在上篇中,我们介绍了如何通过设置runtimeCompiler为true,在Vue中实现了动态创建电子表格组件.想了解具体内容可看点击查看使用VUE组件创建SpreadJS自定义单元格(一). 但是在 ...

  4. wpf自定义控件中使用自定义事件

    wpf自定义控件中使用自定义事件 1 创建自定义控件及自定义事件 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 2 ...

  5. Vue组件中引入jQuery

    一.安装jQuery依赖 在使用jQuery之前,我们首先要通过以下命令来安装jQuery依赖: npm install jquery --save # 如果你更换了淘宝镜像,可以使用cnpm来安装, ...

  6. vue组件中的样式属性：scoped，解决在父组件中无法修改子组件样式问题

    Scoped CSS规范是Web组件产生不污染其他组件,也不被其他组件污染的CSS规范. vue组件中的style标签标有scoped属性时表明style里的css样式只适用于当前组件元素,它是通过使 ...

  7. vue组件中的样式属性--scoped

    Scoped CSS Scoped CSS规范是Web组件产生不污染其他组件,也不被其他组件污染的CSS规范. vue组件中的style标签标有scoped属性时表明style里的css样式只适用于当 ...

  8. vue组件中使用iframe元素

    需要在本页面中展示vue组件中的超链接,地址栏不改变的方法: <template> <div class="accept-container"> <d ...

  9. Vue 组件中 data 为什么必须是函数

    原文地址 vue组件中的data必须是函数 类比引用数据类型 Object是引用数据类型,如果不用function 返回,每个组件的data 都是内存的同一个地址,一个数据改变了其他也改变了; jav ...

  10. vue组件中的data为什么是函数？

    一.vue组件中的data为什么是函数 为了保证组件的独立性 和 可 复用性,data 是一个函数,组件实例化的时候这个函数将会被调用,返回一个对象,计算机会给这个对象分配一个内存地址,你实例化几次, ...

随机推荐

  1. Sql sever 分组排序

    维护人事的时候人事局要求加入一个新功能,详细需求例如以下:加入的人员在同一个单位的依照顺序编号而且单位也要实现时间排序,也就是说有两个排序,第一单位名称排序.先创建的一直在前.然后依照创建时间依次排序 ...

  2. Cocos2d-X-3.0 之后的版本的环境搭建

     Cocos2d-X-3.0 之后的版本的环境搭建 由于cocos2d游戏开发引擎更新十分频繁,官方文档同步不够及时和完善.所以不要照着官方文档来照做生成工程. <点击图片就能进入网站> ...

  3. react-grid-layout

    一个好用的拖拽.自适应布局 react 插件 基本使用: // 显示全部 chart 内容区域 import React,{PureComponent} from 'react'; import {R ...

  4. 2016/05/16 thinkphp3.2.2 验证码使用

    Think\Verify类可以支持验证码的生成和验证功能. 生成验证码 下面是最简单的方式生成验证码: $Verify =new \Think\Verify(); $Verify->entry( ...

  5. wsgiref — WSGI Utilities and Reference Implementation nginx

    from wsgiref.util import setup_testing_defaults, request_urifrom wsgiref.simple_server import make_s ...

  6. 并不对劲的loj2179:p3714:[BJOI2017]树的难题

    题目大意 有一棵树,\(n\)(\(n\leq2*10^5\))个点,每条边\(i\)有颜色\(w_i\),共有\(m\)(\(m\leq n\))种颜色,第\(i\)种颜色的权值是\(c_i\)(\ ...

  7. Lightoj 1068(数位DP)

    求一段区间中被k整除,各个位数相加之和被k整除的数的个数. 这不是重点,重点是k太大了,最大值有10000,所以不能直接开那么大的数组. 仔细分析一下可以发现,由于数最大是2的31次方(2147483 ...

  8. JNI编程(一) —— 编写一个最简单的JNI程序（转载）

    转自:http://chnic.iteye.com/blog/198745 忙了好一段时间,总算得了几天的空闲.貌似很久没更新blog了,实在罪过.其实之前一直想把JNI的相关东西整理一下的,就从今天 ...

  9. PCB 合拼遍历(全排序+旋转90度) 基本遍历方法

    分享一下PCB合拼的组合的遍历方法,在分享之前先纠正一下 PCB拼板之多款矩形排样算法实现--学习  时间复杂度计算错误  一.PCB 合拼(全排序+旋转90度)的时间复杂度是多少? 二.合拼遍历(全 ...

  10. Swift4 扩张(Extenstion), 集合(Set)

    创建: 2018/03/09 完成: 2018/03/10 更新: 2018/04/19 修改小标题  [扩张的定义与使用协议] -> [通过扩张来采用协议] 更新: 2018/09/18 标题 ...