Actualmente estoy usando Next.js y TypeScript y estoy confundido con el mensaje de error que recibo aquí. Aquí hay algo de contexto para la situación. Estoy haciendo una llamada a la API y estoy recibiendo un objeto de matrices.
const fetchDogBreeds = async () => { const res: any = await axios.get("https://dog.ceo/api/breeds/list/all"); const data: any = res.data.message; setDogBreeds( Object.entries(data).map( (breed:any) => breed[0].charAt(0).toUpperCase() + breed[0].substring(1) ) ); };El código funciona bien, pero recibo este error de TypeScript y no entiendo lo que significa. Error:
Argument of type 'string[]' is not assignable to parameter of type 'SetStateAction<never[]>'. Type 'string[]' is not assignable to type 'never[]'.Soy un poco nuevo en TypeScript, así que estoy un poco confundido sobre cómo hacer que desaparezca este error. ¡Gracias por adelantado!
Todo lo que tiene que hacer es definir el tipo de matriz res como esta
const res: string[] = await axios.get("https://dog.ceo/api/breeds/list/all"); Sin asignar el tipo de matriz, se establecerá por defecto como never
Agregue el tipo de respuesta a axios.get , esto se transmitirá como el tipo de response.data .
export interface DogBreeds { message: Record<string, string[]>; } const fetchDogBreeds = async () => { const res = await axios.get<DogBreeds>("https://dog.ceo/api/breeds/list/all"); const data = res.data.message; // call setDogBreeds and do other stuff. }También debe proporcionar los parámetros correctos para mapear:
Object.entries(data).map(([key, value]: string[]) => {});Cambié el código a esto:
const fetchDogBreeds = async () => { const res = await axios.get("https://dog.ceo/api/breeds/list/all"); const data = res.data.message; const listOfDogBreeds: any = Object.entries(data).map( (breed: any) => breed[0].charAt(0).toUpperCase() + breed[0].substring(1) ); setDogBreeds(listOfDogBreeds); };y ya no obtengo errores de TypeScript