Reactjs Context Api React 的问题

我try 使用上下文Api来保存来自Firebase API的用户数据，但当我在组件索引中获得这些值​​时，它总是返回错误: TypeError:对象不可迭代(无法读取属性符号(Symbol.iterator))

以下是我的代码

我应该在哪里创建上下文

import React, { createContext, useState } from "react";

const Context = createContext();

function AuthProvider({children}) {

  const [userLogin, setUserLogin] = useState({});

  return (
    <Context.Provider value={{ userLogin, setUserLogin }} >
      { children }
    </Context.Provider>
  );
}

export { Context, AuthProvider }

路径文件

 <React.StrictMode>
    <BrowserRouter>
      <AuthProvider>
        <Routes>
          <Route path='/' element={<Login />} />
          <Route path='/cadastrar' element={<Register />} />
          <Route path='/recuperar-senha' element={<Recovery />} />
          <Route path='/anuncios' exact element={<Index />} />
        </Routes>
      </AuthProvider>
    </BrowserRouter>
  </React.StrictMode>

在这里，我使用Firebase数据设置上下文

    const {setUserLogin} = useContext(Context);
    
      const { register, handleSubmit, formState: { errors } } = useForm();
    
      const onSubmit = data => {
    
        const auth = getAuth();
    
        signInWithEmailAndPassword(auth, data.email, data.password)
          .then((userCredential) => {
            const user = userCredential.user;
    
            setUserLogin({user});
    
            navigate('/anuncios');
          })
          .catch((error) => {
            let erroMessage = localizeErrorMap(error.code)
    
            Toast('error', erroMessage);
          })
      };

我希望将数据保存在上下文API中，并能够使用下面的组件和其他组件

import React, {useContext} from "react";

import  { Context } from '../providers/auth';


export default function Index() {

  const [user, setUserLogin] = useContext(Context);
  //console.log(user);
  return (
    <h1>Logado {user}</h1>
  )
}

我在浏览器控制台中看到，当我单击该组件时，它通知问题出在行中:const[User，setUserLogin]=useContext(Context)；