使用 route.params React Native 传递图像

问题描述

我尝试使用 route.params 传递图像，但它不起作用。

从第一个屏幕我传递这样的结果：

onPress={() => props.navigation.navigate('Save',saveImage(),{result} )}

我的第二个屏幕我尝试显示我的图像我喜欢这样：

 <Image style={styles.image} source={{ uri: `data:image/png;base64,${props.route.params.result}` }}/>

我通过 printscreen a View 得到我的结果，如果我 console.log 我的 Image on screen One 我得到我的结果，但是如果 console.log on screen number 显示“undefined”。

这是我保存图像和这项工作的方式：

  const saveImage = async () => {
  const image = await captureRef(inputEl,{
      result: 'base64',quality: 1,format: 'png',});
    setResult(image);
  };

解决方法

我建议您使用此代码：

    const saveImage = async () => {
       var  image = null
       image = await captureRef(inputEl,{
             result: 'base64',quality: 1,format: 'png',});
   if(image) return image ;
  };

 const goSaveImage = () => {
    saveImage().then((image)=>{
      props.navigation.navigate('Save',{result : image} )
    })
 }

并在您的 onPress 上：

onPress={() => goSaveImage()}

,

你应该在 useEffect 中导航。

useEffect(() => {
  if (result) {
    props.navigation.navigate('Save',result)
  }
},[result])

onPress={saveImage}