如何在谷歌成功登录React18后重定向到另一个页面？

Question

我有一个问题，当试图重定向到一个不同的页面后，与谷歌签署了我的反应18项目。登录谷歌后，没有重定向发生，我也不知道为什么不行。这是我的Login.jsx文件。在单击我的react页面上的Google按钮并成功地登录到Google之后，什么都没有改变。

import React from 'react';
import { GoogleLogin } from 'react-google-login';
import { GoogleLogout } from 'react-google-login';
import { createRoot } from 'react-dom/client';
import { useNavigate } from 'react-router-dom';
import { FcGoogle } from 'react-icons/fc';
import shareVideo from '../assets/share.mp4';
import logo from '../assets/logowhite.png';

import { client } from '../client';

const Login = () => {

  const navigate = useNavigate();

  const responseGoogle= (response) => {
    localStorage.setItem('user', JSON.stringify(response.profile.Obj));

    const { name, googleId, imageUrl } = response.profileObj;

    const doc = {
      _id: googleId,
      _type: 'user',
      userName: name,
      image: imageUrl,
    }

    client.createIfNotExists(doc)
      .then(() => {
        navigate('/', { replace: true })
      })
  }
  return (
    <div className='flex justify-start items-center flex-col h-screen'>
      <div className='relative w-full h-full'>
          <video 
            src={shareVideo}
            type='video/mp4'
            loop
            controls={false}
            muted
            autoPlay
            className='w-full h-full object-cover'
          />
          <div className='absolute flex flex-col justify-center items-center top-0 right-0 left-0 bottom-0 bg-blackOverlay'>
              <div className='p-5'>
                  <img src={logo} width='130px' alt='Ack! This WAS a logo :/' />
              </div>

              <div className='shadow-2xl'>
                    <GoogleLogin 
                      clientId="380323139927-1809a59ll0fp29rfo40jmubp01c2ife8.apps.googleusercontent.com"
                      render={(renderProps) => (
                        <button
                          type='button'
                          className='bg-mainColor flex justify-center items-center p-3 rounded-lg cursor-pointer outline-none'
                          onClick={renderProps.onClick}
                          disabled={renderProps.disabled}
                          onSuccess={responseGoogle}
                          onFailure={responseGoogle}
                          cookiepolicy='single-host-origin'
                        >
                          <FcGoogle className='mr-4' /> Sign in with Google
                        </button>
                      )}  
                      
                    />
              </div>
          </div>
      </div>
    </div>
  )
}

export default Login

如果需要，这里是我的index.js文件：

import React, { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import { BrowserRouter as Router } from 'react-router-dom';

import App from './App';
import './index.css'

const rootElement = document.getElementById("root");
const root = createRoot(rootElement);


root.render(
    <Router>
    <App />
    </Router>, 
    document.getElementById('root')
    );

如果有人知道怎么解决这个问题，我会非常感激的。提前谢谢。

Answer 1

localStorage.setItem('user', JSON.stringify(response.profile.Obj));

应该是：

localStorage.setItem('user', JSON.stringify(response.profileObj));

根本就没有“。在profile和Obj之间