如何保存切换状态,刷新页面后不会丢失
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何保存切换状态,刷新页面后不会丢失相关的知识,希望对你有一定的参考价值。
你好我的项目主要来自react和redux,我在这个应用程序中建立应用程序,当它将数据同步到日历时切换,我希望它在刷新页面后保持切换。这是一些代码
constructor(props){
super(props);
this.state ={
value: 1,
toggled: undefined
};
this.handleToggle = this.handleToggle.bind(this);
}
handleToggle = (event,toggled,index) => {
this.setState({toggled});
if (toggled == true){
///sync the Calendar code////
}else{
/// un sync ////
}
}
回来之后
<Toggle label={translate('sync')}
onToggle={this.handleToggle}
toggled={this.state.toggled}
/>
是否存在除了this.state以外的状态标记?
答案
在卸载时保存localStorage中的状态,并在初始安装时重新填充
constructor(props){
super(props);
const local = localStorage.getItem('state');
if(local) {
this.state =JSON.parse(local)
} else {
this.state ={
value: 1,
toggled: undefined
};
this.handleToggle = this.handleToggle.bind(this);
}
}
handleToggle = (event,toggled,index) => {
this.setState({toggled});
if (toggled == true){
///sync the Calendar code////
}else{
/// un sync ////
}
componentWillUnmount() {
localStorage.setItem('state', JSON.stringify(this.state));
}
以上是关于如何保存切换状态,刷新页面后不会丢失的主要内容,如果未能解决你的问题,请参考以下文章