javascript - React Context Consumer does not update with Hooks state

Question

I am using React Context Provider and Consumer in order to pass data from my App component to its children.

My Context is called CurrentUserContext. I declare it like this:

const CurrentUserContext = React.createContext();

and export it like this:

export default CurrentUserContext;

I am wrapping my App component with CurrentUserContext.Provider and passing as the value a stateful data I declare like this:

const [loggedUser, setLoggedUser] = useState(null);

When I want a child component to use the data, I wrap it with CurrentUserContext.Consumer.

It all works perfectly fine, but for some reason, when I update loggedUser using setLoggedUser (in useEffect for example), the consumers does not get re-rendered.

Does anyone know why?

I want every time that I update loggedUser using setLoggedUser, the relevant components (the consumers) will re-render.

Does anyone know what doesn't it work?

Thank you!

Answer 1

等待大神答复