vue兄弟组件传值

vue中除了父子组件传值,父传子用props,子传父用$emit,有时候兄弟组件之间也需要传值

1. 先定义一个中间件,src下面新建self.js

import Vue from 'vue';
let Self = new Vue;
export default Self;

A组件要传值给B组件

要传值的组件A

复制代码
<template>
  <div>
     <button @click="gotoB">到B页面的按钮</button>
  </div>
</template>

<script>
import Self from '@/self'
export default{
     methods:{
        gotoB(){
           Self.$emit('sss',this.checkedOrderList)
           this.$router.push({name:'B'})
        }
    }
}

</script>
复制代码

要接受的组件B

复制代码
import Self from '@/self'
export default{
     data(){
       return{
         param:''
      }
   },
    created(){
         var vm = this;
     Self.$on('sss',function(val){
            console.log(val);
            vm.param = val; // 接收传过来的值
        })
    }
}
复制代码

 

posted @   c-137Summer  阅读(1657)  评论(0编辑  收藏  举报
编辑推荐:
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
阅读排行:
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 【杭电多校比赛记录】2025“钉耙编程”中国大学生算法设计春季联赛(1)
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
历史上的今天:
2017-10-25 jQuery Validation Engine 表单验证,自定义规则验证方法
点击右上角即可分享
微信分享提示