Vue页面之间跳转传值（兄弟组件之间通信）

一般这种情况使用bus作为中介来通信

一、新建一个bus.js文件

import Vue from 'vue'
// Event Bus
const bus = new Vue()
export default bus

二、A组件

首先引入bus.js

import Bus from "@/assets/js/bus";

在A组件中触发事件，调用push()方法

<el-button  @click="push(list)" >保存</el-button>

methods:{push(list){Bus.$emit("list", list);this.$router.push({ path: `/admin/messageCenter/${list}` });}
}

三、B组件

首先引入bus.js

import Bus from "@/assets/js/bus";

在B组件mounted中接收数据

mounted(){Bus.$on("list", this.saveData);}

saveData(val) {console.log(val); //打印list
},

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！