Vuejs2 如何停止从基本src/App.vue触发事件？

在vue/cli 4应用程序中 在src/App.vue中，我有从服务器检索数据的方法，如：

mounted() {
    retrieveAppDictionaries(['copyright_text', 'site_heading', 'site_name']);
    bus.$on('appDictionariesRetrieved', (data) => {
        this.copyright_text = data.copyright_text
        this.site_heading = data.site_heading
        this.site_name = data.site_name
    })
}, // mounted() {

在其中一个页面中，我使用了类似的方法从服务器检索数据，但参数不同，如：

mounted() {
    retrieveAppDictionaries(['userTaskTypesLabels']);
    bus.$on('appDictionariesRetrieved', (data) => {
        this.userTaskTypesLabels = data.userTaskTypesLabels
    })

}, // mounted() {

问题是，在第二种情况下，也会触发从src/App.vue检索的AppDictionaries，这是怎么回事。 如何从src/App.vue检索停止触发AppDictionaries？

这是一个侦听器：

bus.$on('appDictionariesRetrieved')

您基本上创建了两个侦听器，因此它们在接收消息时都会执行此工作

改为这样做：

• 将所有数据存储在存储器中，以便可以从一个组件访问
• 仅在一个组件中创建此侦听器（在

  App.vue

  中）
• 向该侦听器发送包含所需数据的消息

App.vue 您可以在发出侦听器时动态指定该侦听器的数据，具体取决于数据的来源：

let data = {
  copyright_text: '',
  site_heading: '',
  site_name: '',
  purpose: 'purpose1',
  list: ['copyright_text', 'site_heading', 'site_name']
  
}
bus.$emit('appDictionariesRetrieved', data)

假设您使用的是事件总线，则必须为其创建新的Vue实例。如果我们在一个组件中发出一个事件，当该组件被销毁时，它将停止侦听该事件。但是，在这种情况下，Vue实例永远不会被销毁，因此侦听器始终存在

因此，当你听到一个声音时，停止听这些事件是一个很好的做法 组件被销毁以避免冲突，就像您的情况一样

---

1） 我不喜欢把所有数据都保存在商店里（应用程序有vuex）。我的商店保存记录的用户信息。只有在打开某个特定页面时，我们才需要UserTaskTypesLabel的数据。为什么要为一个甚至没有打开的页面检索它？2） 代码中的data.purpose是什么？某种类型的密钥发送到服务器并从服务器返回，以便在我们需要它时读取？如果您不想在一个组件中使用侦听器，只需在每个组件中创建它，但仍然使用那里的

if

语句，以便您将创建的所有侦听器不会立即运行，只运行您需要的侦听器。该

purpose

属性用于侦听器处理程序中的

if

语句，因此它只运行您告诉它运行的

if

分支

let data = {
  copyright_text: '',
  site_heading: '',
  site_name: '',
  purpose: 'purpose1',
  list: ['copyright_text', 'site_heading', 'site_name']
  
}
bus.$emit('appDictionariesRetrieved', data)

export default {
 beforeDestroy() { // just before a component is destroyed.
  bus.$off('appDictionariesRetrieved') // stop listening.
 }
}