Tratando de usar el contexto para pasar valores entre componentes:

Creé un archivo para manejar el Contexto: el único problema que tengo ahora es que:

"No se puede llamar a createContext con el objeto literal vinculado a defaultValue porque el número [1] no es compatible con el Number [2] en el index de propiedades".

 // @flow import React, { createContext, useContext } from "react"; export type CountryIndexProviderType = { index: Number, }; const CountryContext = createContext<CountryIndexProviderType>({ index: 0, }); type CountryContextProviderProps = { index: Number, }; const CountryContextProvider = ({ index }: CountryContextProviderProps) => { return <CountryContext.Provider value={{ index }}></CountryContext.Provider>; }; const useCountryIndexContext = () => useContext(CountryContext); export { CountryContext, CountryContextProvider, useCountryIndexContext };

Primer componente mediante el cual se establece el valor del índice:

 import { CountryContextProvider } from "/EnteredCountriesContext"; return ( <StyledWrappingContainer> <StyledProgress>{index + 2}</StyledProgress> <CountryContextProvider index={index}></CountryContextProvider> </StyledWrappingContainer> );

Segundo componente que intenta consumir Contexto:

 import { useCountryIndexContext } from "/EnteredCountriesContext"; const { index } = useCountryIndexContext(); <StyledWrappingContainer> <StyledProgress> <StyledProgress>{index + 2}</StyledProgress> </StyledProgress> </StyledWrappingContainer>

Acabo de incluir JSX, solo otro código que tengo relevante para mis nuevos cambios en torno al contexto es la importación de React en el primer componente.