How to add multiple image using react native image picker

Question

I am building a simple social media Application. The User can add status, location, video from youtube, and photos. But I had a problem uploading multiple images using react native image picker. I have read the documentation but I don't know how to fix the problem

Here's my function code

onPhotoPress() {
 const options = {
  quality: 1.0,
  maxWidth: 50,
  maxHeight: 50,
  storageOptions: {
    skipBackup: true,
  },
};
ImagePicker.launchImageLibrary(options, openPicker(), (response) => {
  console.log('Response = ', response);

  if (response.didCancel) {
    console.log('User cancelled photo picker');
  }
  else if (response.error) {
    console.log('ImagePicker Error: ', response.error);
  }
  else if (response.customButton) {
    console.log('User tapped custom button: ', response.customButton);
  }
  else {
    const source = { uri: `data:image/jpeg;base64,${response.data}` };

    this.setState({
      avatarSource: source,
      name: response.fileName,
      data: response.data,
      type: response.type,
      path: response.uri,
    });
  }
 });
}

This my code for view images

         {this.state.avatarSource !== null ?
          <Image
            source={this.state.avatarSource}
            style={{
              flex: 1,
              resizeMode: 'contain',
              marginVertical: 12,
            }}
          /> : <View /> }

This is picture for upload single image

so Can you help me, to get multiple image or give me advice another library i should use to solve my problem

Answer 1

This library started as a basic bridge of the native iOS image picker, and I want to keep it that way. As such, functionality beyond what the native UIImagePickerController supports will not be supported here. Multiple image selection, more control over the crop tool, and landscape support are things missing from the native iOS functionality - not issues with my library. If you need these things, react-native-image-crop-picker might be a better choice for you.

As you can see in the React Native Image Picker README, you can't do multiple images selection using this module. You better try to use React Native Image Crop Picker to do that.

Answer 2

100% Sure this is working

use the library for multiple images selection and upload 
react-native-image-crop-picker

import ImagePicker from 'react-native-image-crop-picker';


  takePics = () => {
    ImagePicker.openPicker({
      width: 200,
      height: 200, compressImageMaxHeight: 400,
      compressImageMaxWidth: 400, cropping: true, multiple: true
    })
      .then(response => {
        let tempArray = []
        console.log("responseimage-------" + response)
        this.setState({ ImageSource: response })
        console.log("responseimagearray" + this.state.ImageSource)
        response.forEach((item) => {
          let image = {
            uri: item.path,
            // width: item.width,
            // height: item.height,
          }
          console.log("imagpath==========" + image)
          tempArray.push(image)
          this.setState({ ImageSourceviewarray: tempArray })
          // console.log('savedimageuri====='+item.path);

          console.log("imagpath==========" + image)
        })

      })

  }