1.在main.js中定义一个值(红色为重点)

new Vue({
el: '#app',
data: {
Bus: new Vue()
},
router,
store,
render: h => h(App)
})

2.在components/EditOrder.vue组件中点击按钮传值

<template>
<div class="analysis"
@click="analysis">点击</div>
</template>
<script>
export default {
methods: {
analysis() {
this.$root.Bus.$emit('analysisClick', true)
}
}
}
</script>

3.components/analysisAddress.vue中接收EditOrder组件传值

<script>
export default {
mounted() {
const that = this
this.$root.Bus.$on('analysisClick', function (msg) {
that.addressAnalysis = msg
})
}
</script>

好啦,大功告成,是不是很简单的样子

vue子组件与子组件之前传值-----最简单办法的更多相关文章

  1. Vue 组件&组件之间的通信 之 子组件向父组件传值

    子组件向父组件传值:子组件通过$.emit()方法以事件形式向父组件发送消息传值: 使用步骤: 定义组件:现有自定义组件com-a.com-b,com-a是com-b的父组件: 准备获取数据:父组件c ...

  2. Vue 组件&组件之间的通信 之 父组件向子组件传值

    父组件向子组件传值:父组件通过属性向下传值的方式和子组件通信: 使用步骤: 定义组件:现有自定义组件com-a.com-b,com-a是com-b的父组件: 准备获取数据:com-b要获取父组件dat ...

  3. vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值。

    vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值. vue 父组件与子组件相互通信 一.父组件给子组件传值 props 实现父组件向子组件传值. 1父组件里: ...

  4. 【转】Vue组件一-父组件传值给子组件

    Vue组件一-父组件传值给子组件 开始 Vue组件是学习Vue框架最比较难的部分,而这部分难点我认为可以分为三个部分学习,即 组件的传值 - 父组件向子组件中传值 事件回馈 - 子组件向父组件发送消息 ...

  5. vue 父组件给子组件传值 Vue父组件给子组件传方法 Vue父组件把整个实例传给子组件

    Home.vue <template> <!-- 所有的内容要被根节点包含起来 --> <div id="home"> <v-header ...

  6. Vue中父组件向子组件传值

    Vue中父组件向子组件传值 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  7. 【vue】父组件主动调用子组件 /// 非父子组件传值

    一  父组件主动调用子组件: 注意:在父组件使用子组件的标签上注入ref属性,例如: <div id="home"> <v-header ref="he ...

  8. Vue 父组件向子组件传值,传方法,传父组件整体

    父子组件传值 1.父组件调用子组件时绑定属性,例如-> :title="title" 2.子组件中在props中声明title:props:['title','msg'] 3 ...

  9. Vue props父组件向子组件传值详解

    vue官网上可以说有我们想要的一切,先贴上通过prop传值的官网地址:通过prop向子组件传递数据 Prop是什么? Prop是你可以在组件上注册的一些自定义特性.当一个值传递给一个prop特性的时候 ...

随机推荐

  1. Elasticsearch 主要监控指标 -- 描述了es监控的几个维度,相当不错!

    转发自:https://blog.csdn.net/majianxiong_lzu/article/details/90437559 主要指标梳理 Cluster Health – Nodes and ...

  2. JAVA基础之设置随机成语验证码

    package com.oracle; import java.awt.Color; import java.awt.Font; import java.awt.Graphics; import ja ...

  3. HTTP协议学习总结

    一个web应用程序,往往是通过http协议进行前后端通信的.而作为一个web工程师,掌握HTTP协议因此也是Web开发必备的一项技能了,尤其是在工作了一定年限之后,更是深感该知识点的重要性.因此,将以 ...

  4. Jenkins系列之-—DevOps高效插件推荐【转】

    基于Jenkins及其插件生态实现自己的持续交付与DevOps平台. jenkins 插件官网 Blue Ocean Jenkins2.7以后可安装,是Jenkins的一种新视图,能够通过图形化的界面 ...

  5. 小程序的openid和公众号的openid是否一致

    早期的产品只用了公众号,没有注册开放平台(没有unionid).然后现在需要上线小程序,这种情况下,企业是同一个企业的,但是公众号的openid和小程序的openid是否一致呢? 我来回答你这个问题: ...

  6. 关于python模块总结

    名词解释 模块(module):在python中,一个.py文件就是一个模块 包(package):为了避免模块名冲突,Python又引入了按目录来组织模块的方法.当目录下存在__init__.py, ...

  7. X509IncludeOption 枚举

    X509IncludeOption 枚举 指定 X.509 数据应包括 X.509 证书链的哪些内容. EndCertOnly 2 X.509 链信息中仅包括最终证书. ExcludeRoot 1 包 ...

  8. heapq 对有序的数组列表进行整体排序

    """ 功能:实现对有序的多个数组整体排序,获取top k个最小元素 """ from heapq import * def heap_so ...

  9. ThinkPHP模板之二

    模板布局及变量比较,循环. controller <?php /** * Created by PhpStorm. * User: Sahara * Date: 2019/6/23 * Time ...

  10. 《逆袭团队》第九次团队作业:Beta冲刺与验收准备

    项目 内容 软件工程 任课教师博客主页链接 作业链接地址 团队作业9:Beta冲刺与团队项目验收 团队名称 逆袭团队 具体目标 (1)掌握软件黑盒测试技术:(2)学会编制软件项目总结PPT.项目验收报 ...