在 asyncData 函数中访问 Vuex答案

【问题标题】：Access Vuex in asyncData function在 asyncData 函数中访问 Vuex
【发布时间】：2019-07-28 14:57:12
【问题描述】：

我想在 asyncData 中访问我的 Vuex 数据，但我不能。另外我似乎无法在 asyncData 中使用 axios 模块。

我尝试了很多。

pages/index.vue

export default {
  asyncData() {
    //in my project there's a lot more code here but i think this is enough 
    let id = this.$store.state.id //i know i should prob use getter but no
    //here i want to do an axios req with this var "id" but axios doesnt work
    return axios.get(`url${id}`)
      .then(...) //not gonna write it out here
  }
}

store/index.js

export const const = () => ({
  id: "#5nkI12_fSDAol/_Qa?f"
})

我希望它从 Vuex 获取 ID，然后执行 Axios req。整个应用程序不起作用。

【问题讨论】：

标签： javascript vuex nuxt.js

【解决方案1】：

context 提供了从 Nuxt 到 Vue 的附加对象/参数组件。上下文在特殊的 Nuxt 生命周期区域中可用像asyncData、fetch、plugins、middleware、modules 和 nuxtServerInit.

Reference

export default {
  asyncData({ store }) {
    const id = store.state.id
    return axios.get(`url${id}`)
      .then(...)
  }
}

【讨论】：