我想在ReactJS中從一個頁面導航到另一個頁面，我正在使用history.push，但它給我一個錯誤，即
TypeError: Cannot read properties of undefined (read 'push') at Login.jsx:65 at async loginHandel (Login.jsx:51)
這是我的App.js代碼
import React from "reaction";
import "bootstrap/dist/css/bootstrap.min.css"。
import Login from "./components/Login" 。
function App(/span>) {
return (
<div className="App"/span>>
<Login />
</div>
);
}
export default App;
這是我的login.jsx函式代碼
。 const loginHandel = async ( ) => {
setLoading(true) 。
const data = await axios
.get(
`http://116.202.231.219:8069/Restaurant/Login_Updated?Cont4=${email}& Pswd=${password}`
)
.then((res) => {
//check the res if its getting the correct data or not?
//相應地重新構造。
console.log（res）。
const persons = res;
if (persons.status == 200) {
//在這里執行任何事情。
alert("It is working") 。
// setUser(persons);
setLoading(false)。
history.push("/dashboard") 。
//window.open("./Dashboard.jsx").
}
})
.catch((err) => {
//handel your error
console.log（err）。
alert("user email and passwoed mismatched!")。
// setLoading(false);.
});
};
我希望在API成功后，它應該將我導航到儀表盤頁面，但它沒有，它給出了它正在作業的警報，同時也給出了用戶電子郵件和密碼不匹配的警報，如果你們有人能幫助我解決這個問題，我將非常感激
。uj5u.com熱心網友回復：
你需要具備的幾個條件：
你需要具備的幾個條件
你需要具備幾個條件：
你需要具備幾個條件：
你需要具備幾個條件
import {BrowserRouter as Router, Switch, Route}。from 'react-router-dom'
function App() {
return (
<div className="App"/span>>
<Router>/span>
<交換機>
< Route path='/' component={/* 匯入 和 使用 你的 組件 */}。/>
</Switch>
</Router>/span>
</div>
);
}
- 使用
useHistory鉤子來訪問history.push（對于在<Router>下渲染的組件，這將是真的）
import{useHistory}。from 'react-router-dom'
const YourFunctionComponent = props => {
const history = useHistory()
const letsChangeLocation = () => history.push('/wherever'>)
}
uj5u.com熱心網友回復：
你需要在你的組件中匯入useHistory，然后用它來導航。
span class="hljs-keyword">import { useHistory } from "react-router-dom"。
//在組件中。
const history = useHistory();
history.push('/url'/span>)
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/334270.html
標籤：