vue 不同界面的通信

不建議這種調(diào)用方式。 這種調(diào)用方式對于他人來說難以理解，難以調(diào)試和修改。

建議的做法是通過父子組件通信或者全局store的方式管理數(shù)據(jù)， 數(shù)據(jù)的改變?nèi)ビ|發(fā)方法的調(diào)用。

建議使用vuex

有兩個方式：

1. 將全局組件放在某個全局環(huán)境中，比如：

// bar.vue
{
  methods: {
    wishSign() {
    
    }
  },
  beforeCreate() {
    Vue.prototype.$bar = this;
  }
}

// detail.vue
{
  methods: {
    onClick() {
      this.$bar.wishSign();
    },
  }
}

這種方式使得組件依賴全局環(huán)境中的 $bar 變量。算是比較強耦合的一種結(jié)構(gòu)，不過通常來說也不是太大的問題，只要你不濫用。

2. 使用全局的事件總線

以前官方文檔介紹過，現(xiàn)在找不到了。大概方案是聲明一個 Vue 實例作為全局事件總線，所有注冊偵聽器都通過它來進行：

// event.js
export const bus = new Vue();

// bar.vue
import {bus} from './event';
{
  methods: {
    wishSign() {
    
    }
  },
  beforeCreate() {
    bus.on('some-event', this.wishSign);
  }
}

// detail.vue
import {bus} from './event';
{
  methods: {
    onClick() {
      bus.$emit('some-event');
    }
  }
}

這樣結(jié)構(gòu)耦合程度更低。