参数错误的NuxtJS中的未知动态嵌套路由?

时间:2019-02-03 22:49:01

标签: javascript vue.js vuejs2 vue-router nuxt.js

我仍在学习如何使用NuxtJS,我在这里看到了文档:https://nuxtjs.org/guide/routing#unknown-dynamic-nested-routes,如果您在名为'_.vue'的页面文件夹中添加文件,如果没有的话在pages文件夹中指定的路径。

这很好并且很好,但是我现在需要做的是能够将参数传递给该文件。我目前正在尝试在pages / _slug / index.vue中进行复制,即:

asyncData ({ params }) {
    return axios.get(`https://example.com/wp-json/wp/v2/pages?slug=${params.slug}`)
    .then((res) => {
      return {
        page: res.data[0]
      }
    })
    .catch(error => {
      console.log(error)
      this.errored = true
    })
  },

因为它位于'_slug'文件夹中,所以我可以将params.slug传递给它,并且效果很好。但是我现在试图在_.vue文件中包含所有内容,但不确定在此文件中获取slug参数的最佳方法。我尝试仅将该函数添加到该文件中,但是没有用。

是否可以将slug参数传递给NuxtJS中的_.vue文件?

1 个答案:

答案 0 :(得分:0)

使用param.pathMatch:

asyncData ({ params }) {
  return axios.get(`https://example.com/wp-json/wp/v2/pages?slug=${params.pathMatch}`)
    .then((res) => {
      return {
        page: res.data[0]
      }
    })
    .catch(error => {
      console.log(error)
      this.errored = true
    })
},