Estoy tratando de aplicar filtro y paginación en mi página de lista de productos. pero no sé cómo pasar valores a getServersideprops igual que cuando obtenemos datos en useEffect y pasamos los valores actualizados como dependencia en reaccionar js
aqui esta mi codigo gracias de antemano
export const getServerSideProps = async () => { const res = await fetch(`http://localhost:4000/api/products?page=1&limit=20&sortBy=price&sortAs=asc`); const data = await res.json(); return { props: {productsData: data} } } function Home({ productsData}) { const products = productsData?.data.products && productsData.data.products?.map((item) => { return item }) return ( <> <h1>Latest Products</h1> <Row> {products.map((product) => ( <Col key={product.id} sm={12} md={6} lg={4} xl={3}> <Card className="my-3 p-3 rounded"> <Link href={`/product/${product.id}`}> <Card.Img src={product.image} variant="top" /> </Link> <Card.Body> <Link href={`/product/${product.id}`}> <Card.Title as="div"> <strong>{product.name}</strong> </Card.Title> </Link> <Card.Text as="div"> <Rating value={product.rating} text={`${product.numReviews} reviews`} /> </Card.Text> <Card.Text as="h3">${product.price}</Card.Text> </Card.Body> </Card> </Col> ))} </Row> </> ); } export default HomePuede usar parámetros de URL y obtenerlos en getServerSideProps
export async function getServerSideProps({ query }) { const limit = query.limit; const page = query.page; const res = await fetch(`http://localhost:4000/api/products?page=${page}&limit=${limit}&sortBy=price&sortAs=asc`); const data = await res.json(); return { props: {productsData: data,page,limit} } }