如何解决使用 .then 在 2 个屏幕之间导航
我正在开发一个移动应用程序,它拍照然后在不同的屏幕上呈现它,我能够这样做,但问题是当我调用图像选择器来获取图像然后将其传递到另一个屏幕时,我得到了在导航到第二个屏幕之前,我的按钮显示大约一秒钟的第一个屏幕,我如何防止这种情况发生,这里是代码:
useEffect(() => { if(image) navigating() },[image]);
const takePicture=()=>{
ImagePicker.openCamera({
mediaType:'photo',width: 300,height: 400,includeBase64:true,cropping: true,}).then(image => {
setImage(image.path);
});
}
这是导航功能
const navigating=()=>{
return navigation.navigate("Result",{
key: image,})
}
解决方法
您可以在 Image 上使用 useEffect 钩子,以便在设置图像时调用您的导航功能。
useEffect(() => { 如果(图像) 导航() },[图像]);
,你的代码的问题是你不能在组件 jsx 中使用导航 你需要使用 useEffact 来代替
,我认为没有办法在选择图像后直接导航到第二个屏幕。您可以做的是添加一个加载程序以在用户选择图像时隐藏第一个屏幕。像这样
const [loading,setLoading] = useState(false);
const takePicture=()=>{
setLoading(true);
ImagePicker.openCamera({
mediaType:'photo',width: 300,height: 400,includeBase64:true,cropping: true,}).then(image => {
navigation.navigate('Result',{ key: image });
setLoading(false);
});
}
if (loading) return <ActivityIndicator />;
return (....)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。