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. JS中的if语句内如何加or使多个条件通过

    if(a==1&&b==2){ //do something }//条件是a等于1  并且  b等于2时才能成立,两个条件必须同时满足 if(a==1||b==2){ //do som ...

  2. SpringBoot的入门程序

    1. 创建一个springboot工程 可以参考springboot入门程序 2. 创建一个实体类 @Data //想相当于@Setter.@Getter和@ToString替代了setter.get ...

  3. Java自学-操作符 位操作符

    Java的位操作符 位操作符 在实际工作中使用并不常见. 示例 1 : 一个整数的二进制表达 位操作都是对二进制而言的,但是我们平常使用的都是十进制比如5. 而5的二进制是101. 所以在开始学习之前 ...

  4. webpack集成vue单文件模式的很多坑(研究了1个星期)

    1.一开始不知道局部安装webpack后,如何调用webpack. 后来看说明文档(webpack中文网)才知道,有个npx可以启动本地安装的webpack. 我估计:全局安装webpack,全局的w ...

  5. ES5和ES6的继承

    ES5继承 构造函数.原型和实例的关系:每一个构造函数都有一个原型对象,每一个原型对象都有一个指向构造函数的指针,而每一个实例都包含一个指向原型对象的内部指针, 原型链实现继承 基本思想:利用原型让一 ...

  6. Charles关于Https SSLHandshake解决备忘录

    抓包Https时错误提示:SSLHandshake: Received fatal alert: unknown_ca   1.准备工作,下载Charles版本 有情链接,提取码为:ghc6,其中包含 ...

  7. Mac版StarUML破解方法

    StarUML是用nodejs写的.确切的说是用Electron前端框架写的.新版本中所有的starUML源代码是通过asar工具打包而成.确切的代码位置在“%LOCALAPPDATA%\Progra ...

  8. [LeetCode] 19. 删除链表的倒数第N个节点 ☆☆☆

    描述 给定一个链表,删除链表的倒数第 n 个节点,并且返回链表的头结点. 示例: 给定一个链表: 1->2->3->4->5, 和 n = 2. 当删除了倒数第二个节点后,链表 ...

  9. Hive使用过程中踩过的坑

    hive启动时错误1 Cannot execute statement:impossible to write to binary long since BINLOG_FORMAT = STATEME ...

  10. Apache虚拟主机&伪静态配置

    Apache基本操作 安装:yum install httpd 启动:systemctl start httpd 查看进程:ps -ef | grep httpd 查看端口:sudo netstat ...