第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

登錄功能后history.push不起作用

登錄功能后history.push不起作用

青春有我 2023-09-21 10:04:47
我嘗試history.push()在設(shè)置令牌后使用。不知何故,頁(yè)面沒(méi)有重定向到新路徑。我已經(jīng)使用了useHistory訪(fǎng)問(wèn)歷史記錄的功能。一旦我重新加載頁(yè)面,它就會(huì)重定向到主頁(yè)。我嘗試了其他類(lèi)型的黑客但無(wú)法找到解決方案。請(qǐng)幫忙。應(yīng)用程序.jsfunction App() {  const [isAuthenticated, setAuthenticated] = useState(false);  useEffect(()=>{    if(cookie.get('authorization')){      setAuthenticated(true);    }    else{      setAuthenticated(false);    }  },[])  return (    <Router>      <Switch>        <Route exact path="/">          {isAuthenticated?<Redirect to="/home"/>:<Login />}        </Route>        <PrivateRoute exact path="/user/:id" component={UserDetail} auth={isAuthenticated} />        <PrivateRoute exact path="/createuser" component={CreateUser} auth={isAuthenticated} />        <PrivateRoute exact path="/home" component={ListUser} auth={isAuthenticated} />      </Switch>    </Router>  );}export default App;登錄.jsimport React, { useEffect, useState } from 'react';import {useHistory} from 'react-router-dom';function Login() {    const history = useHistory();    const loginUser = (body) => {        SetLoader(true);        fetch('/api/v2/users/tokens', {            method: 'POST',            body: JSON.stringify(body),            headers: {                'Content-Type': 'application/json',            }        })            .then(response => {                SetLoader(false);                if (response.status == 200) {                    SetError(false);                       cookie.set('authorization',response.headers.map.authorization,{path:'/'});                    history.push('/');                }                else {                    SetError(true);                    StoreResponse(JSON.parse(response._bodyInit).message);                }            })            .catch((error) => {                console.error('Error:', error);            });    }}export default Login;
查看完整描述

1 回答

?
慕田峪7331174

TA貢獻(xiàn)1828條經(jīng)驗(yàn) 獲得超13個(gè)贊

我沒(méi)有看到組件history中定義的位置Login。此外,您還設(shè)置了 cookie,但isAuthenticated僅在App組件安裝時(shí)設(shè)置,以后絕不會(huì)更新。


您可以傳遞回調(diào)來(lái)Login更新?tīng)顟B(tài),并在重新渲染和重新渲染具有重新封閉狀態(tài)的路由App時(shí)讓重定向自然發(fā)生。它還已經(jīng)嘗試專(zhuān)門(mén)匹配和渲染路線(xiàn),因此將您的路徑從最具體到最不具體排序,并且您不需要將 prop 添加到每個(gè)路線(xiàn)。AppisAuthenticatedSwitchexact


應(yīng)用程序


function App() {

  const [isAuthenticated, setAuthenticated] = useState(false);


  useEffect(() => {

    if (cookie.get("authorization")) {

      setAuthenticated(true);

    } else {

      setAuthenticated(false);

    }

  }, []);


  return (

    <Router>

      <Switch>

        <PrivateRoute

          path="/user/:id"

          component={UserDetail}

          auth={isAuthenticated}

        />

        <PrivateRoute

          path="/createuser"

          component={CreateUser}

          auth={isAuthenticated}

        />

        <PrivateRoute

          path="/home"

          component={ListUser}

          auth={isAuthenticated}

        />

        <Route path="/">

          {isAuthenticated ? (

            <Redirect to="/home" />

          ) : (

            <Login setAuthenticated={setAuthenticated} /> // <-- pass callback

          )}

        </Route>

      </Switch>

    </Router>

  );

}

登錄


function Login({ setAuthenticated }) { // <-- destructure prop

  const loginUser = (body) => {

    SetLoader(true);

    fetch("/api/v2/users/tokens", {

      method: "POST",

      body: JSON.stringify(body),

      headers: {

        "Content-Type": "application/json"

      }

    })

      .then((response) => {

        if (response.status == 200) {

          SetError(false);

          cookie.set("authorization", response.headers.map.authorization, {

            path: "/"

          });

          setAuthenticated(true); // <-- set authenticated

        } else {

          SetError(true);

          StoreResponse(JSON.parse(response._bodyInit).message);

        }

      })

      .catch((error) => {

        console.error("Error:", error);

      })

      .finally(() => {

        SetLoader(false); // <-- set loading false in finally block

      });

  };


  ...

}


查看完整回答
反對(duì) 回復(fù) 2023-09-21
  • 1 回答
  • 0 關(guān)注
  • 190 瀏覽
慕課專(zhuān)欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢(xún)優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)