vue2.0组件之间传递数据

一，父向子

当父组件向子组件传数据的时候用这种方法比较简单。步骤为：

1，在子组件中声明props

2，在父组件中使用子组件时传入数据

二，组件之间

在组件之间如果两个组件之间的关系很远可以使用这种方法。

1，首先声明一个工具js命名为eventBus.js

在eventBus.js里面先导入vue在共享一个vue实例。

2，在发送方导入eventBus.js

使用.$emit方法传值。

3，在接收方使用on接收

on方法一般直接放在created里

vue2.0组件之间传递数据的更多相关文章

  1. vue2.0 组件之间的数据传递

    组件间的数据传递// 父组件<template><div class="order"><dialog-addpro v-on:closedialog= ...

  2. vue.js 组件之间传递数据

    前言 组件是 vue.js 最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用.如何传递数据也成了组件的重要知识点之一. 组件 组件与组件之间,还存在着不同的关 ...

  3. Vue2.0组件之间通信（转载）

    Vue中组件这个特性让不少前端er非常喜欢,我自己也是其中之一,它让前端的组件式开发更加合理和简单.笔者之前有写过一篇Vue2.0子父组件通信,这次我们就来聊一聊平级组件之间的通信. 首先我们先搭好开 ...

  4. Vue2.0组件之间通信

    Vue中组件这个特性让不少前端er非常喜欢,我自己也是其中之一,它让前端的组件式开发更加合理和简单.笔者之前有写过一篇Vue2.0子父组件通信,这次我们就来聊一聊平级组件之间的通信. 首先我们先搭好开 ...

  5. vue2.0组件之间的传值

    1.父子组件--props props:需要注意的是,虽然的是单向的数据流,但是如果传递的是数组或是对象这样的引用类型,子组件数据变化,父组件的数据通也会变化 子组件代码 <template&g ...

  6. vue组件父子组件之间传递数据

    举个栗子: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  7. vue项目中多个组件之间传递数据

    //父组件<template> <div> <div style="float: left"> <input-data :city=&qu ...

  8. 解决vue不相关组件之间的数据传递----vuex的学习笔记，解决报错this.$store.commit is not a function

    Vue的项目中,如果项目简单, 父子组件之间的数据传递可以使用  props 或者 $emit 等方式 进行传递 但是如果是大中型项目中,很多时候都需要在不相关的平行组件之间传递数据,并且很多数据需要 ...

  9. vue2.0 组件化及组件传值

    组件 (Component) 是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素,Vue.js 的编译器为它添加特殊功能.在有些情况下, ...

  10. Vue2.0组件间数据传递

    Vue1.0组件间传递 使用$on()监听事件: 使用$emit()在它上面触发事件: 使用$dispatch()派发事件,事件沿着父链冒泡: 使用$broadcast()广播事件,事件向下传导给所有 ...

随机推荐

  1. Educational Codeforces Round 150 (Rated for Div. 2) A-E

    比赛链接 A 代码 #include <bits/stdc++.h> using namespace std; using ll = long long; bool solve() { i ...

  2. MRS-MRS相同功能代码管理应用笔记

    MRS相同功能代码管理应用笔记 使用 MounRiver(以下简称 MRS )进行 RISC-V 单片机开发时,工程目录下往往存在多个文件夹与文件,我们只需要着重关注截图中红框所示的部分,它们自上而下 ...

  3. SQL SERVER 查看表说明，字段属性

    查询表字段属性,说明等: 1 SELECT 2 表名=case when a.colorder=1 then d.name else '' end, 3 表说明=case when a.colorde ...

  4. Kafka 如何保证消息不被重复消费？或者说，如何保证消息消费的幂等性？

    如何保证消息不被重复消费?或者说,如何保证消息消费的幂等性? >幂等性,通俗点说,就一个数据,或者一个请求,给你重复来多次,你得确保对应的数据是不会改变的,不能出错. kafka 的机制:  K ...

  5. 4.2 针对PE文件的扫描

    通过运用LyScript插件并配合pefile模块,即可实现对特定PE文件的扫描功能,例如载入PE程序到内存,验证PE启用的保护方式,计算PE节区内存特征,文件FOA与内存VA转换等功能的实现,首先简 ...

  6. Windows下打开指定目录并定位到具体文件

    一.在Windows上,网上流传的几种方法可以打开目录并定位到指定文件: 1.使用系统调用: 使用system()函数执行操作系统的命令行命令. 在命令行命令中,使用explorer /select, ...

  7. Unity UGUI的Mask（遮罩）组件的介绍及使用

    Unity UGUI的Mask(遮罩)组件的介绍及使用 1. 什么是Mask组件? Mask(遮罩)组件是Unity UGUI中的一个重要组件,用于限制子对象的可见区域.通过设置遮罩组件,可以实现一些 ...

  8. 分布式多协议接入网关FluxMQ-2.0功能说明

    FluxMQ-2.0版本更新内容 前言 FLuxMQ是一款基于java开发,支持无限设备连接的云原生分布式物联网接入平台.FluxMQ基于Netty开发,底层采用Reactor3反应堆模型,具备低延迟 ...

  9. 教师节专题：AI互动课来了，即构方案助推在线教育创新升级

    打开热门综艺,乘风破浪的姐姐们告诉你"用瓜瓜龙英语给孩子启蒙":走出家门,电梯口.公交站的大幅广告跟你说"2-8岁上斑马". 如果说去年的AI互动课还是浮于媒体 ...

  10. MapReduce实现TopN的效果

    1.背景 最近在学习Hadoop的MapReduce,此处记录一下如何实现 TopN 的效果,以及在MapReduce中如何实现 自定义分组. 2.需求 我们有一份数据,数据中存在如下3个字段,订单编 ...