react-native - 如何在 React Native 中将图像作为导航参数传递

Question

我正在使用 Image Picker 来获取用户照片，然后我需要在下一个屏幕中显示它。我怎样才能做到这一点？

图像选择器功能：

const options={
    title: 'Profile picture',
    takePhotoButtonTitle: 'Take picture',
    chooseFromLibraryButtonTitle: 'Choose from gallery'
}

myFun=()=>{
    ImagePicker.showImagePicker(options, (response) => {
        console.log('Response = ', response);

        if (response.didCancel) {
          console.log('User cancelled image picker');
        } else if (response.error) {
          console.log('ImagePicker Error: ', response.error);
        }
         else {
          const source = { uri: response.uri };

          // You can also display the image using data:
          // const source = { uri: 'data:image/jpeg;base64,' + response.data };

          this.setState({
            avatarSource: source,
          });
        }
      });
}

我需要使用此按钮将图像传递到下一个屏幕：

<GradientButton text='Next' onPress={() => {this.props.navigation.navigate('NextScreen', {photo: this.state.avatarSource} )}}/>

这就是我尝试的方式，但我无法让它工作，我只设法通过导航参数传递正常值，如字符串。

Answer 1

<GradientButton text='Next' onPress={() => {this.props.navigation.navigate('NextScreen' {photo: this.state.avatarSource} )}}/>

看起来有语法错误，你必须在“NextScree”之后加一个逗号，这样它应该是；

<GradientButton text='Next' onPress={() => {this.props.navigation.navigate('NextScreen', {photo: this.state.avatarSource} )}}/>

在下一个屏幕中，您可以使用props.navigation.getParam('photo').

希望有帮助。