Показать загруженное изображение в другом компоненте

Question

У меня есть код, который выбирает изображение из галереи, я хочу, чтобы после выбора изображения перейти к другому компоненту для отображения выбранного изображения, он работает нормально, пока я не перехожу к другому компоненту, на самом деле не отображается выбранное изображениея не знаю как мне его там показать, помогите пожалуйста, вот код:

state = {
 image: null,
};

_pickImage = async () => {
  const { navigate } = this.props.navigation;

  let result = await ImagePicker.launchImageLibraryAsync({
   allowsEditing: false,
   aspect: [4, 4],
  });

  navigate('ConfirmImage');

if (!result.cancelled) {
  this.setState({ image: result.uri });
 }

Для загрузки изображения

let { image } = this.state;
<TouchableOpacity onPress={this._pickImage}><Text>Upload</Text></TouchableOpacity>

Answer 1

Чтобы отобразить изображение на экране ConfirmImage

1. , вам необходимо передать изображение URI в качестве параметра навигации с первого экрана.

 navigate(
  'ConfirmImage', 
  { uri : result.uri }
);

Доступ к переданному значению в ConfirmImage.

//ConfirmImage.js 

 render() {
  const { navigation } = this.props;
  const uri = navigation.getParam('uri');

  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
      <Image  style={{width: 50, height: 50}} source={{uri:uri}}/>
    </View>
  )
}