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 @ 2018-10-25 19:40  c-137Summer  阅读(1650)  评论(0编辑  收藏  举报