Error : Objects are not valid as a React child (found: object with keys {user})-CodePudding

I am setting up the authentication flow for my app using context API


const AuthContext = createContext({
});

export const AuthProvider = ({ children }) => {
  return (
    <AuthContext.Provider value={{ user: "Abdullah" }}>
      {children}
    </AuthContext.Provider>
  );
};

export default function useAuth() {
  return useContext(AuthContext);
}```

Error that I am getting is : : Objects are not valid as a React child (found: object with keys {}). If you meant to render a collection of children, use an array instead

CodePudding user response：

the issue here that you are export default the useAuth function and also export AuthProvider . but on your App you are importing AuthProvider as a default export. import AuthProvider from "./hooks/useAuth"; so instead it should be import {AuthProvider} from "./hooks/useAuth";