Así que tengo esta página Next.js. Estoy tratando de usar los parámetros de solicitud y usarlos en una función, pero por alguna razón siempre está indefinido. He intentado todo lo que sé.
id en la función.useEffect , no funcionó.Aquí está mi código:
import React, { useState, useEffect } from 'react' import { useRouter } from 'next/router' import axios from 'axios'; export default function id () { const [ response, setResponse ] = useState(""); const router = useRouter(); const id = router.query.id; const testFunction = (id) => { console.log(id); } useEffect((id) => { testFunction(); }, []) return ( <div> <p>params: {id}</p> </div> ) }Lo primero es lo primero, debe nombrar su archivo con el nombre de su parámetro (ejemplo: [id].tsx )
Nota: si lo coloca dentro de una carpeta (como la imagen), la ruta será http://localhost:3000/folder-name/your-param
Y luego, prueba este código:
import React from 'react' id.getInitialProps = ({ query }:any) => { const { id } = query return { id } } export default function id({id}:any) { console.log(id); // You can use the query outside the return by calling `id` return ( <div> <p>params: {id}</p> </div> ) }prueba esto
import React, { useState, useEffect } from 'react' import { useRouter } from 'next/router' import axios from 'axios'; export default function id () { const [ response, setResponse ] = useState(""); const router = useRouter(); const id = router.query.id; const testFunction = (id) => { console.log(id); } useEffect((id) => { testFunction(); }, [router]) return ( <div> <p>params: {id}</p> </div> ) }