0
179
Views¿Hay alguna forma de que use router.query en el siguiente js en una función?
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é.
- Sé que no necesito poner la
iden la función. - Intenté usar el enrutador en
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> ) }
·
Juan Pablo Isaza
2 answers
Answer question0
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> ) }
·
Juan Pablo Isaza
Report
0
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> ) }
·
Juan Pablo Isaza
Report
Answer question