Soy un principiante en TypeScript. En mi proyecto React, busco algunos datos y configuro el estado de esos datos. Parece que la API obtiene una propiedad adicional: la propiedad independiente. Sin embargo, si trato de configurar esta propiedad manualmente en un objeto que implementa la interfaz de país, falla con Tipo... no es asignable para escribir 'País'. El objeto literal solo puede especificar propiedades conocidas, y 'independiente' no existe en el tipo 'País' Además, si una propiedad no está definida al configurar manualmente las propiedades, falla con la propiedad faltante , sin embargo, si la respuesta no tiene una propiedad específica, no hay ninguna advertencia o error al configurar el estado (o al distribuir manualmente el primer elemento de la respuesta en un objeto creado con la interfaz de país). ¿Crees que estoy estropeando algo en mi código? En caso afirmativo, ¿cuál es una mejor manera de establecer el estado en el componente? Si no, ¿cuáles son las ventajas de usar la interfaz/tipo de TypeScript aquí además de las sugerencias de propiedades?
import { useEffect, useState } from 'react'; interface Country { name: string; population: Number; region: string; capital: string; flags: { svg: string; png: string; }; } const CountryList: React.FC = () => { const [countries, setCountries] = useState<Country[]>([]); useEffect(() => { const getCountries = async () => { const countryAPIResponse = await ( await fetch( 'https://restcountries.com/v2/all?fields=name,population,region,capital,flags' ) ).json(); setCountries(countryAPIResponse); }; getCountries(); }, []); console.log(countries[0]); return <div></div>; }; export default CountryList;