如何解决Next.js 路由向前工作但向后有问题
我很难理解 next.js 路由是如何工作的，而且我认为我使用它是错误的。 当我使用 Link 向前浏览页面时，我没有问题，但是当我使用浏览器后退按钮时，它有时会重新加载上一页，有时会停留在同一页面上，而 url 已更改。然后我需要手动刷新页面
我想这是我做错的地方，但不知道是什么
index.js :
import Head from "next/head";
import NewBooks from "../components/Homepage";
import { getProducts } from "../utils/api";
const HomePage = ({ products }) => {
return (
<div>
<Head>
<title>Classe moyenne éditions</title>
</Head>
<NewBooks products={products} />
</div>
);
};
export async function getStaticProps() {
const products = await getProducts();
return { props: { products } };
}
export default HomePage;
书籍/index.js :
import Head from "next/head";
import Catalogue from "../../components/Catalogue";
import { getProducts } from "../../utils/api";
const CataloguePage = ({ products }) => {
return (
<div>
<Head>
<title>Catalogue</title>
</Head>
<Catalogue products={products} />
</div>
);
};
export async function getStaticProps() {
const products = await getProducts();
return { props: { products } };
}
export default CataloguePage;
-
组件/目录.js :
从“next/link”导入链接； 从“../utils/medias”导入 { getStrapiMedia }; 从'react-bootstrap'导入{卡片}；
const Catalog = ({ products }) => {
return ( <div className="container-cat"> {products.map((_product) => ( <Card id="lien" key={_product.id} alt="book" className="items"> <Link href='/books/[name]' as={`/books/${encodeURIComponent(_product.name)}`}> <a> <Card.Body> <Card.Img variant="top" src={getStrapiMedia(_product.grid_pic.url)} width="200px" /> <Card.Title>{_product.name}<br />{_product.author}<br />{_product.price} €</Card.Title> </Card.Body> </a> </Link> </Card> )) } </div> );};
导出默认目录；
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
