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. C#字符串基础

    C#字符串基础 1.    字符串的两种创建形式 (1)String A=”cat”; (2)String B=new string{‘a’,4}  .调用类方法,创建一个“aaaa”的字符串 (3) ...

  2. kubernetes使用securityContext和sysctl

    前言 在运行一个容器时,有时候需要使用sysctl修改内核参数,比如net..vm..kernel等,sysctl需要容器拥有超级权限,容器启动时加上--privileged参数即可.那么,在kube ...

  3. 解决java依赖poi导出Excel表时,没有出现下载提示的问题

    转自:https://blog.csdn.net/jinchunzhao123/article/details/88626077 浏览器响应: 而且进入断点调试,所有的数据都执行了就是没有下载提示.而 ...

  4. Alpha_4

    一. 站立式会议照片 二. 工作进展 (1) 昨天已完成的工作 a. 我的·主界面设计 b. 番茄钟的页面及音乐选择弹窗页面设计 c. 实现自定义习惯和设置新习惯的功能页面,并可预览 d.已实现番茄钟 ...

  5. 使用虹软ArcFac,java 离线SDK 进行人脸识别

    公司项目需要人脸识别登录,需要支持离线识别,所以无法使用在线的人脸识别的API,于是使用到了离线SDK来对比识别人脸相识度. 获取人脸抓拍的图片需要对接设备,这里不做记录,假设我们已经获取到了人脸图片 ...

  6. c# 泛型study

    1.引用类型约束:  类型实参包含任何类,接口,数组,委托,或者是已知是引用类型的另一个类型参数 class demo<T> where T:class 有效的封闭区间demo<St ...

  7. 利用chocolatey软件包管理工具安装yarn,比npm更快更稳定

    Chocolatey 是一个 Windows 专用的软件包管理工具. Yarn 对你的代码来说是一个包管理器, 你可以通过它使用全世界开发者的代码, 或者分享自己的代码.Yarn 做这些快捷.安全.可 ...

  8. Python学习日记(二十八) hashlib模块、configparse模块、logging模块

    hashlib模块 主要提供字符加密算法功能,如md5.sha1.sha224.sha512.sha384等,这里的加密算法称为摘要算法.什么是摘要算法?它又称为哈希算法.散列算法,它通过一个函数把任 ...

  9. 常见数据结构的 Python 实现(建议收藏)

    数据结构作为计算机基础的必修内容,也是很多大型互联网企业面试的必考题.可想而知,它在计算机领域的重要性. 然而很多计算机专业的同学,都仅仅是了解数据结构的相关理论,却无法用代码实现各种数据结构. 今日 ...

  10. Give root password for maintenance

    linux开机出现"Give root password for maintenance (or type Control-D to continue):" 出现这种情况一般为两种 ...