javascript - Next/router nothing happens when browser’s back button click

Question

I don't understand why, when I click on browser’s back button my page doesn't reload.

I have a catalog component inside /pages/index.js which is my home page, a dynamic route to navigate to the products /pages/books/[name].js

This is the Link I use to go to the products pages :

<div className="container-cat">
       {products.map((_product) => (
                    <Card id="lien" key={_product.id} alt="book" className="catalogue">
                    <Link href='/books/[name]' as={`/books/${_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>

I don't know what else to put here ...

question from:https://stackoverflow.com/questions/65900917/next-router-nothing-happens-when-browser-s-back-button-click

Answer 1

I change my routes, putting the catalog component as the index.js of the /pages/books/

I can't really explain why, but it works