小编raf*_*kas的帖子

我是 ReactJS 的新手。在页面初始加载时，我想检查是否state为空，然后我想重定向到另一个login Page

这是组件代码：

export default function Addblousesalwar() {
  const navigate = useNavigate();
  const { state } = useLocation();
  console.log(state)   //null
  if(state === null || state === undefined){
    navigate("/login")
  }

但它显示错误：

You should call navigate() in a React.useEffect(), not when your component is first rendered.

我也尝试通过 useEffect 。但 useEffect 没有被执行。

useEffect(() => {
    if(state === null || state === undefined){
      navigate("/")
    }
  }, []);



useEffect(() => {
    if(state === null || state === undefined){
      navigate("/")
    } …

我正在创建一个Webpage. 我正在使用Material UI组件。这是代码：

import {  makeStyles, Typography } from "@material-ui/core";
const useStyles = makeStyles((theme) => ({

    container: {
        backgroundColor: "white", display: displayStyle
    },

}));
export default function HomePage() {
    const classes = useStyles();

    const [displayStyle, setDisplayStyle] = useState("flex")

    return (
        <>
            <div>My Page</div>
            <div className={classes.container}>
                <div >
                    <Typography  >
                        Our Orders
                    </Typography>
                </div>
            </div>
        </>
    );
}

我有一个名为 的州displayStyle。我想在 中使用这个状态值makeStyles。但它显示displayStyle未定义，因为它位于函数内部。如何让它在makeStyles. Styles我想根据值设置state。请帮我提供一些解决方案

我正在设计一个使用ReactJS. 在这里，我用于react-router-dom导航目的。

在这里，看起来像

import { BrowserRouter, Route, Routes } from 'react-router-dom'
    <BrowserRouter>
        <Routes>
              <Route exact path='/login' element={<LoginPage />} />
              <Route exact path='/homePage' element={<HomePage />} />
              <Route exact path='/detailsPage' element={<DetailsPage />} />
        </Routes>
    </BrowserRouter>

由于在最近的版本中useHistory被替换useNavigation，我正在使用它 useNavigation来导航页面。

代码：

import { useNavigate } from "react-router";
const navigate = useNavigate();

 / **For Navigating ** /
navigate("/login")

效果很好。但是当我导航到 时loginPage，我想清除浏览器Back按钮中存储的所有历史记录。我在 中找到了解决方案useHistory。但在 中useNavigation，它不起作用。

我尝试过的代码：

navigate[0] = navigate[navigate.length - 1]
navigate("/login") …