路由器推送后在 asyncData 中获取路由参数答案

【问题标题】：get route params in asyncData after router push路由器推送后在 asyncData 中获取路由参数
【发布时间】：2019-03-04 22:32:17
【问题描述】：

我正在尝试在 asyncData 方法中获取路由参数，如果我手动进入路由，它可以工作，但如果我使用路由器 Push 方法，它不会获取任何参数。

这是我的 asynData 方法：

  async asyncData(ctx) {
    const { id } = ctx.app.router.currentRoute.params
    await ctx.store.dispatch('user/GET_USER', id)
    return {
      user: ctx.store.state.user.user
    }
  },

这就是我导航到相应页面的方式：

goToEdit(id) {
  this.$router.push({ path: `/users/${id}/edit` })
}

【问题讨论】：

如果你console.log(ctx)你能看到参数，你会得到什么？
它返回带有前一个路由参数的上下文。

标签： vuejs2 vue-router nuxt.js

【解决方案1】：

你需要直接从 ctx 获取路由。 Here 上下文参数列表

 async asyncData({ route }) {
    const { id } = route.params
    await ctx.store.dispatch('user/GET_USER', id)
    return {
      user: ctx.store.state.user.user
    }
},

【讨论】：

【解决方案2】：

我正在以类似的方式执行此操作，但我从 context 检索参数和几乎所有内容。

async asyncData(context) {
        const plans = await context.$axios.get("business/get-plans", {
            params: {
                currency: context.query.currency
            }
        }).then((res) => {
            return res.data;
        });

看看context.$axios和context.query。

【讨论】：