在React中使用会话时标题没有更新?

时间:2016-11-03 01:04:04

标签: javascript reactjs session-storage

我使用sessionStorage来存储我的登录响应数据,例如token& userId。我遇到的问题是,在重定向到我的主页后,我的标题根本没有重新渲染。

这是我的Header状态& componentWillMount功能:

constructor(props) {
        super(props);
        this.state = {
            isUserLogged: false,
            user: {
                id: 0,
                name: '',
                type: 'member'
            }
        };
    }

    componentWillMount() {
        if ((typeof sessionStorage === 'undefined') || (sessionStorage == null)) {

        } else {
            let login = sessionStorage.getItem("isUserLogged");
            let userId = sessionStorage.getItem("id");
            let userToken = sessionStorage.getItem("token");
            this.setState({isUserLogged: login});
            this.setState({id: userId});
            this.setState({token: userToken});
            console.log(login + '' + userId + '' + userToken); //isUserLogged = true
        }
     console.log(this.state.isUserLogged); //isUserLogged = false
    }

我的loginSuccess功能:

export function loginSuccess(data) {
            sessionStorage.setItem("token", data.id);
            sessionStorage.setItem("id", data.userId);
            sessionStorage.setItem("isUserLogged", true);
            browserHistory.push('/');
}

我的componentWillMount中的登录工作正常,但我收到错误Uncaught Error: Minified React error #105

我尝试更改为componentWillUpdateshouldComponentUpdate。错误消失但我不认为我应该使用此功能,尤其是当用户默认在另一个选项卡中登录时。

TLDR:标题不能重新呈现&我正在使用componentWillMount。任何解决方案?

编辑:我注意到在if-else声明之后我记录状态时,状态并没有立即改变。可能是因为componentWillMount必须完成运行才会更新状态。在文档中,它提到setState()是一个待定的状态转换。希望任何人都可以回答这个问题。感谢。

0 个答案:

没有答案