Javascript 航海家及；异步存储反应本机

您好，我是react native的新手，目前正在学习异步存储

我想实现条件渲染导航器。如果AsyncStorage中有值键，则初始路由转到第2页，如果AsyncStorage中没有值键，则初始路由转到第1页

如果我关闭应用程序并再次打开，我希望它显示相应的页面是否有密钥。请帮忙

以下是我迄今为止所做的工作：

import React，{Component}来自'React'；
进口{
评估学，
文本输入，
样式表，
文本，
看法
领航员，
可触摸不透明度，
异步存储，
}从“反应本机”；
var initialRoute={id:1}
var STORAGE_KEY='@AsyncStorageExample:KEY'；
var SCREEN_WIDTH=require（'Dimensions'）.get（'window'）.WIDTH；
var BaseConfig=Navigator.sceneconfig.FloatFromRight；
var customLeftToRightSpiration=Object.assign（{}，BaseConfig.pirters.pop{
速度：8，
边缘宽度：屏幕宽度，
});
var CustomSceneConfig=Object.assign（{}，BaseConfig{
弹簧张力：100，
弹簧摩擦：1，
手势：{
pop:CustomLeftToRight手势，
}
});
var Page1=React.createClass({
_goToPage2（）{
AsyncStorage.setItem（存储密钥，“这是密钥”）；
this.props.navigator.push（{id:2}）
},
render（）{
返回(
这是第一页
保存密钥
)
},
});
var Page2=React.createClass({
componentDidMount（）{
这是。_loadInitialState（）；
},
异步_loadInitialState（）{
试一试{
var value=await AsyncStorage.getItem（存储密钥）；
如果（值！==null）{
this.setState（{selectedValue:value}）
}否则{
}
}捕获（错误）{
}
},
getInitialState（）{
返回{
selectedValue:空
};
},
_签名的（）{
AsyncStorage.removeItem（存储密钥）；
this.props.navigator.push（{id:1}）
},
render（）{
if（this.state.selectedValue==null）{
开始=
}否则{
开始=
这是第2页
键：{this.state.selectedValue}
删除键
}
返回(
开始
);
},
});
var TestAsync=React.createClass({
_renderScene（路线、导航器）{
如果（route.id==1）{
返回
}else if（route.id==2）{
返回
}
},
_renderScene1（路线、导航器）{
如果（route.id==1）{
返回
}else if（route.id==2）{
返回
}
},
_配置场景（路线）{
返回CustomSceneFig；
},
render（）{
var initialRoute={id:1}
if（AsyncStorage.getItem（存储密钥）！=null）{
initialRoute={id:2}
}
返回(
);
}
});
const styles=StyleSheet.create({
容器：{
弹性：1，
为内容辩护：“中心”，
对齐项目：“居中”，
背景颜色：“#F5FCFF”，
},
欢迎:{
尺寸：20，
textAlign:'中心'，
差额：10，
颜色：'黑色'，
},
按钮文字：{
尺寸：14，
textAlign:'中心'，
差额：10，
颜色：'白色'，
},
默认值：{
身高：26，
边框宽度：0.5，
尺寸：13，
填充：4，
marginHorizontal:30，
marginBottom:10，
},
});
module.exports=TestAsync您可以在TestAsync类中执行类似的操作

render() {
    var initialRoute = {id:1}
    if(AsyncStorage.getItem(STORAGE_KEY) != null){
       initialRoute = {id:2}
    }
    return(
       <Navigator
        initialRoute={initialRoute}
        renderScene={this._renderScene}
        configureScene={this._configureScene} />
    );
}

render（）{
var initialRoute={id:1}
if（AsyncStorage.getItem（存储密钥）！=null）{
initialRoute={id:2}
}
返回(
);
}

对于“无法读取未定义的属性推送”错误

在渲染方法中的page2代码中，需要传递导航器的引用

而不是

 if(this.state.selectedValue === null) {
      begin = <Page1} />
 }

if（this.state.selectedValue==null）{
开始=
}

用这个

 if(this.state.selectedValue === null) {
      begin = <Page1 navigator={this.props.navigator} />
 }

if（this.state.selectedValue==null）{
开始=
}
如果有人使用React Navigation
版本5
，那么

检查以下代码。这可能会有帮助

函数MyStack（）{
const[isLogedin，setIsLogedin]=React.useState（false）；
AsyncStorage.getItem（'isLogedin'）。然后（（数据）=>{
if（data！=null&&data==true）setIsLogedin（true）
else setIsLogedin（false）
})
返回(
{isLogedin？：}
);
}
已解决！非常感谢@abhishekOh等等，在第1页，当我触摸“保存键”按钮时，它显示错误“无法读取未定义的属性
push
”。有什么解决方案吗？可能您的导航器参考没有在道具中设置。你能更新你的代码吗？