¿Por qué React muestra console.log duplicado? Descubrí que para eliminar StrictMode de index.js. pero no había tal problema antes y por qué eliminé StrictMode en lugar de solucionar el problema. ¿Qué otros problemas podría haber?

vea el corto de pantalla: https://prnt.sc/HLAmthr9efoB

 import React, { useEffect, useState } from "react"; import Country from "../Country/Country.js"; const gridStyle = { display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gridGap: "20px", }; const Countries = () => { const [countries, setCountries] = useState([]); useEffect(() => { fetch("https://restcountries.com/v3.1/all") .then((res) => res.json()) .then((data) => setCountries(data)); }, []); console.log(countries); return ( <div className="all-countries"> <p>{countries.length}</p> <div style={gridStyle} className="country-container"> {countries.map((country) => ( <Country key={Math.random() * 500000} country={country}></Country> ))} </div> </div> ); }; export default Countries;