父组件通过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. Qt实现一个简单的TextEditor

    使用QT实现简单的TextEditor: 首先在窗口添加部件TextEditor,并设置中文字符 MainWindow::MainWindow(QWidget *parent) : QMainWind ...

  2. UIButton的图片和文字相对位置调整

    通常.假设直接设置UIButton的图片和文字,默认的两者相对位置可能不是我们想要的,那么须要进行调整. 须要用到的函数例如以下: UIEdgeInsetsMake(CGFloat top, CGFl ...

  3. Android大牛的博客

    1 谦虚的天下:http://www.cnblogs.com/qianxudetianxia/ 2 csdn博文精选:http://www.csdn.net/article/2011-08-30/30 ...

  4. Codeforces Round #419 (Div. 1) C. Karen and Supermarket 树形DP

    C. Karen and Supermarket     On the way home, Karen decided to stop by the supermarket to buy some g ...

  5. 暴走吧！Snapdragon SDK开发速成指南

    (文/Aurora J) Qualcomm的Snapdragon处理器.它快如闪电.效率极高.擅长挑战多任务极限,而且拥有攻城狮们梦寐以求的无限潜能.它能确保您的手机集4G LTE.极速体验.长久续航 ...

  6. 在Orchard CMS Theme 用代码定义布局Widgets

    因为公司业务需要,经过本人几个月尝试,使用Orchard CMS 开发一个简单的企业门户(地址是http://www.ubof.cn).在刚开始接触Orchard CMS,对于个性化的网页布局不知道怎 ...

  7. C语言中string char int类型转换

    C语言中string -- ::) 转载 ▼ 标签: 操作符 int char c语言 类型转换 分类: C/Cpp ,char型数字转换为int型 "; printf(]-');//输出结 ...

  8. CF上的3道小题(2)

    CF上的3道小题(2) T1:CF630K Indivisibility 题意:给出一个数n,求1到n的数中不能被2到9中任意一个数整除的数. 分析:容斥一下,没了. 代码: #include < ...

  9. AutoIT: 通过页面抓取来陈列任务管理器里面所有进程的列表

    #include<Array.au3> $handle =WinGetHandle("Windows 任务管理器") ;$ctrl =ControlGetHandle( ...

  10. PHP编程常见小错误错误

    使用PHP的过程中经常因为粗心出一些简单的错误,先将自己遇到几个的记录下来,以后慢慢增加. 1 Fatal error: Function name must be a string 翻译很简单,就是 ...