Vue兄弟元件傳參-bus總線傳值

bus總線傳值

我認為bus總線傳值，挺好用的一個方法，操作也相對簡單

一.在項目中建立一個單獨的eventBus.js檔案

import Vue from 'vue'
export default new Vue()      

二.在想傳值的兄弟元件中，引入剛才的js

import eventBus from '@/assets/js/eventBus'
export default {
  data() {
    return {
      fage: true,
    };
  },
  created() {
    
  },
  methods: {
    open() {
      this.fage = !this.fage;
      eventBus.$emit("add", this.fage);//這是傳出的元件
    },
  },
};
      

import eventBus from '@/assets/js/eventBus'
export default {
  data() {
    return {
      isCollapse: true,
    };
  },
  created() {
    eventBus.$on("add", (message) => {
      //一些操作，message就是從元件傳過來的值
      console.log("導航欄傳的值",message);
      this.isCollapse=message
    });
  },