Vue 路由器删除查询参数
P粉947296325
2023-09-02 17:34:15
<p>我正在使用 Nuxt2/Vue2,并且在生成网站时很难获取查询参数。</p>
<p>我通过使用 Contentful 中的条目在 nuxt 配置中创建我的网址,如下所示:</p>
<pre class="brush:php;toolbar:false;">generate: {
crawler: false,
async routes() {
const items = (
await fetchEntriesByContentType({ contentType: "items" })
).map(entry => {
const routes = {
route: `/items/item/${entry.fields.slug}`,
payload: entry,
}
return routes;
});
return items;
}
}</pre>
<p>如果我控制台日志尝试在 Nuxt 配置文件中进行调试,它将按预期返回带有参数的 url,例如/items/item/101?type=book</p>
<p>但是,如果我尝试使用 this.$route.path、this.$route.fullPath 或 this.$route.query 等在我的 Vue 组件中访问它,它在“?”之后永远不会返回任何内容。例如。对于上面的示例,它将始终是 /items/item/101</p>
<p>我需要在 nuxt 配置中添加一些内容来包含查询参数吗?
我注意到,如果我单击 this.$route 转到定义,即使我没有安装 vue-router,它也会转到我的 node_modules 中的 vue-router 文件。这是导致问题的原因吗?</p>
您不会在
map
回调中返回任何内容,假设必须返回routes
,它应该是这样的: