如何在 vue mounted 中使用 await/async

Question

我正在尝试在我的另一个计算属性中使用 mapGetters 值。它显示为空，因为首选项方法未执行完成。我想等到商店设置 getter 和 setter。我试过了 async/await 但它不起作用

mounted() {
  this.preferences();
  this.selectedColumnsHeader;
},

methods: {
  async preferences() {
    await this.$store.dispatch('fetchPreferences');
  }
}

店铺

fetchPreferences({ commit }) {
  return http
    .get('/help_ticket_preferences.json')
    .then((res) => {
      commit('setPreferences', res.data.preference);
    })
    .catch((error) => {
      commit('setErrorMessage', `Sorry, there was an error fetching help ticket preferences ${error.message}.`);
    });
},

Answer 1

首先，您需要在mounted

中等待this.preferences()

async mounted() {
  await this.preferences();
  this.selectedColumnsHeader;
},

其次，您需要 return fetchPreferences

中的 Promise

fetchPreferences({ commit }) {
  return http
    .get('/help_ticket_preferences.json')
    ..... etc

有帮助的锄头

如何在 vue mounted 中使用 await/async

How can use await/async in vue mounted

javascript

vue.js

async-await