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

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

刷新頁(yè)面時(shí)保存狀態(tài) - ReactJS

刷新頁(yè)面時(shí)保存狀態(tài) - ReactJS

不負(fù)相思意 2021-11-12 17:07:42
我有一個(gè)組件,每次我更改屏幕時(shí),應(yīng)用程序都會(huì)通過(guò)該組件。在這個(gè)組件中,我保存isLogged: true了狀態(tài),一個(gè)告訴我是否已登錄的變量。當(dāng)isLogged === true,我重定向到主屏幕,當(dāng)isLogged === false,我重定向到登錄。如果我登錄,我會(huì)進(jìn)入我的應(yīng)用程序并刷新頁(yè)面(f5 或 ctrl+r),失去 isLogged 狀態(tài)并將我重定向到登錄,因?yàn)?isLogged 現(xiàn)在不是 true。我想知道是否有任何方法可以保存 isLogged 變量,以便刷新頁(yè)面(正在登錄)不會(huì)將我重定向回登錄。我試圖將狀態(tài)保存在本地存儲(chǔ)中,但我認(rèn)為它不安全。這是我的代碼:export class Layout extends Component {    constructor(props) {        super(props);        //definimos las variables necesarias        this.state = { isLogged: false, usuarioLogado: any };        //realizamos el bind de las funciones        this.DoLogin = this.DoLogin.bind(this);    }    //funcion donde establecemos los valores de las variables    DoLogin = (logged, usuario) =>        this.setState({            isLogged: logged,            usuarioLogado: usuario        });    render() {        if (this.state.isLogged) {            return <div>                <NavMenu headerTitle={this.props.headerTitle} textos={this.props.textos} valor={this.props.valor} changeLanguage={this.props.changeLanguage} usuario={this.state.usuarioLogado} labelData={this.props.labelData}/>                {this.props.children}            </div>        }        else return <SignIn callbackFromParent={this.DoLogin} labelData={this.props.labelData}/>;    }}
查看完整描述

3 回答

?
米脂

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

對(duì)于這種需要狀態(tài)持續(xù)很長(zhǎng)時(shí)間而不是刷新的情況,我建議使用LocalStorage它,因?yàn)樗梢栽跒g覽器中持續(xù)存在而沒(méi)有問(wèn)題,以下是您可以使用它的方法:


export class Layout extends Component {

  //definimos las variables necesarias

  state = { isLogged: false, usuarioLogado: any };


  //funcion donde establecemos los valores de las variables

  DoLogin = (logged, usuario) => {

    localStorage.setItem('isLogged', true);

    this.setState({ isLogged: localStorage.getItem('isLogged'), usuarioLogado: usuario});

  };


   render() {

   const { changeLanguage, children, headerTitle, labelData, textos, valor } = this.props;

   const { isLogged, usuarioLogado } = tihs.state;


     if (isLogged) {

       return <div>

         <NavMenu headerTitle={headerTitle} textos={textos} valor={valor} changeLanguage={changeLanguage} usuario={usuarioLogado} labelData={labelData} />

                {children}

            </div>

        }

        else return <SignIn callbackFromParent={this.DoLogin} labelData={labelData}/>;

    }

}

此外,如果您愿意,可以LocalStorage在 DevTools 的Application選項(xiàng)卡中LocalStorage(Chrome)下檢查您的收藏。此變量可用于所有文件,使用與以前相同的調(diào)用。


查看完整回答
反對(duì) 回復(fù) 2021-11-12
?
料青山看我應(yīng)如是

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

您必須將身份驗(yàn)證數(shù)據(jù)存儲(chǔ)在瀏覽器存儲(chǔ)或 cookie 中。

如果您在用戶(hù)身份驗(yàn)證后收到某種令牌(在 JWT 的情況下),您可以將其存儲(chǔ)在瀏覽器中localStorage(在選項(xiàng)卡之間保留)或sessionStorage(在當(dāng)前選項(xiàng)卡中保留)。如果您想提高安全性,您應(yīng)該在一段時(shí)間不活動(dòng)后使敏感信息無(wú)效或刪除。好的做法是在短時(shí)間內(nèi)使令牌失效(Web 服務(wù)在當(dāng)前令牌過(guò)期之前向您發(fā)送新令牌,但在它過(guò)期后,用戶(hù)必須再次登錄)。這種方式可以防止竊取令牌,例如,當(dāng)用戶(hù)忘記注銷(xiāo)并離開(kāi)并打開(kāi)瀏覽器時(shí)。


查看完整回答
反對(duì) 回復(fù) 2021-11-12
?
縹緲止盈

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

您可以將其存儲(chǔ)cookie并讀取cookie并在 init 上設(shè)置值

或者您可以將其存儲(chǔ)在其中localStorage并從中讀取

或者您也可以將其存儲(chǔ)在其中indexedDB并從中讀取。

localStorage 可能是最簡(jiǎn)單的

https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/cookies 

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

 https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API

實(shí)際的實(shí)現(xiàn)將在SignIn組件中,它檢查和設(shè)置值。


查看完整回答
反對(duì) 回復(fù) 2021-11-12
  • 3 回答
  • 0 關(guān)注
  • 213 瀏覽
慕課專(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)