我是 NuxtJS 的新手。我的页面由导航栏/菜单、列出所有文章的博客页面和几个主要是静态的页面组成。（就像大多数公司网站一样）
我正在从 Strapi API 检索数据，在该 API 中我只能通过 ID 获取单个条目。
我必须做什么：
当用户单击导航栏链接时，我需要将相应文章/帖子的 ID 传递给文章组件，以便从 API 检索文章。到目前为止，它运行得很好，但是通过路由器参数来完成，一篇文章将有一个类似的 URLhttps://www.example.com/posts/63ndjk736rmndhjsnk736r
我想做的事：
我想要一个带有 slug 的 URLhttps://www.example.com/posts/my-first-Post并仍然将 ID 传递给文章组件/页面。
最好的方法是什么？
您可以使用query。这是一些例子：
我有一些数据：
data = [{id: "63ndjk736rmndhjsnk736r", name: "my-first-post"}, {id: "88ndjk736rmndhjsnk736r", name: "my-second-post"}]
在我的导航栏列表中：
<template v-for="(item, index) in data" key="index">
<router-link :to="{ path: '/posts/' + item.name, query: { id: 'item.id' }}"
>{{item.name}}</router-link>
</template>
您的路线显示方式：
http://example.com/posts/my-first-post?id=63ndjk736rmndhjsnk736r
您需要什么：
- 创建动态路线->https://nuxtjs.org/guide/routing/#dynamic-routes
- Pass
query named id这是您的单次入境 ID
- 获取查询 (id) 并使用查询 id 获取单个条目：
const postId = this.$route.query.id
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
