vue组件之间的数据传递方式（event bus）事件总线

问题场景：子组件想要修改爷爷组件的值，同时把自己展示的也改掉，这可愁坏了我，头发又没3根
解决办法：
1.在项目的main.js文件中，注册事件总线

export const bus = new Vue()

2.在孙子组件中注册事件，并且将参数传递过去

// 引入事件总线
import {bus} from "../../../../main.js"
bus.$emit("onDelete",{Accounting,orderId:this.orderId})

3.在爷爷组件中接受事件，接收参数

bus.$on("onDelete", async ({Accounting,orderId})=>{
      const loading = this.$loading({
        lock: true,
        text: "Loading",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)",
      });
      try {
        let formData = new FormData();
        console.log("error", Accounting);
        formData.append("financial_code", Accounting.financialAccount.code);
        let res = await httpPostFormData(
          `/plan/${orderId}/accounting_products/delete`,
          formData
        );
        console.log("-----删除accounting--", res);
        loading.close();
        this.$message.success("价格删除成功");
        this.editOrder.plan = res.data.queryPlan
      } catch (err) {
        loading.close();
        console.log(err);
      }
    })


4.在监听的地方，还要移除事件的监听


beforeDestroy() {
    bus.$off("onDelete",{});
  },


总结：这个事件总线不会拘泥于组件之间的关系，好用