即時錯誤：“Login.js:12 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'setIsAuth')”
這是我的 Login.js
import React from 'react';
import { auth, provider } from '../firebaseconf';
import { signInWithPopup } from 'firebase/auth';
import { useNavigate } from 'react-router-dom';
function Login({ setIsAuth }) {
let navigate = useNavigate();
const singInWithGoogle = () => {
signInWithPopup(auth, provider).then((result) => {
localStorage.setItem("isAuth", true);
setIsAuth(true);
navigate("/");
});
};
return (
<div>
<button onClick={singInWithGoogle}>Sign in with Google</button>
</div>
);
}
export default Login;
還有我的 App.js
import React, { Component } from 'react';
import './css/main.css';
import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
import Home from './pages/Home';
import CreatePost from './pages/CreatePost';
import Login from './pages/Login';
class App extends Component {
constructor(props) {
super(props);
this.state = {
isAuth: false,
setIsAuth: false
};
}
render() {
return (
<Router>
<nav>
<Link to="/">Home</Link>
<Link to="/createpost"> Create New Post</Link>
{!this.state.isAuth && <Link to="/login">Login</Link>}
</nav>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/login" element={<Login setIsAuth={this.state.setIsAuth} />} />
<Route path="/createpost" element={<CreatePost />} />
</Routes>
</Router>
);
}
}
export default App;
我想我已經在 App.js 的建構式中定義了它，正在尋找你的幫助，謝謝
uj5u.com熱心網友回復：
在login.js您使用setIsAuth時好像它是一個函式但不是一個函式，它是一個變數設定為false您的App.js. 要更改您的值，this.state.setIsAuth您應該執行以下操作：
App.js
signIn = () => {
this.setState({ setIsAuth: true });
}
<Route path="/login" element={<Login setIsAuth={this.signIn} />} />
Login.js
signInWithPopup(auth, provider).then((result) => {
localStorage.setItem("isAuth", true);
setIsAuth();
navigate("/");
});
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/421388.html
標籤：
下一篇：Cookie令牌認證