Arquivo Discussoes de Programacao e Tecnologia Galera, vê se vocês podem me ajudar a identificar esse problema.
Eu tenho um contexto chamado posts, e ele deveria mostrar os dados vindo da API no arquivo que eu chamar ele, porém se eu dou um console.log no state dentro do arquivo de contexto ele tá mandando os dados da API pra lá, porém seu eu dou um console.log no arquivo não qual eu quero usar o contexto, ele mostra um array vazio. Segue abaixo as imagens para vocês situarem.
Um exemplo de ContextProvider:
import React, { createContext, useContext, useState } from "react";
const CountContext = createContext();
const CounterProvider = ({ children }) => {
const [value, setValue] = useState(0);
const handleIncrement = () => setValue(value + 1);
return (
<CountContext.Provider value={{ value, handleIncrement }}>
{children}
</CountContext.Provider>
);
};
export const useCount = () => {
const context = useContext(CountContext);
const { value, handleIncrement } = context;
return { value, handleIncrement };
};
export default CounterProvider;
Perceba que o value tem duas {{ }}, porque você deve passar um objeto e não o valor literal deve ser isso! coloque value={{posts}}, acho que já vai resolver
No createContext não precisa tipar, ou seja,
export const PostsContext = createContext();
porque o tipo vai direto no value, como está no meu exemplo anterior