Image Picker not working in React Native app, why?

问题

I've installed react-native-image-picker successfully, for a fresh react native app, linked it and given right permissions via the info.plist file to access camera, photos etc...

I'm using the code from the ReadMe on react-native-image-picker page, but i receive an error

When attempting to openGallery() i get the following warning and no image library opens:

Possible unhandled Promise Rejection TypeError; undefined is not a function (near...reactNativeImagePicker.default.launchImageLibrary...)

Here's my code:

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

class App extends Component {

  constructor(props) {
    super(props)

    this.state = {
      fileURL: '',
    }
  }

   //function
   openGallery = async () => {
      const options = {
        mediaType: 'video'
      }

    ImagePicker.launchImageLibrary(options, (response) => {
      console('Response = ', response);

      if(response.didCancel){
        console.log('User cancelled image picker');
      }
      else{
       this.setState({ fileURL: response.uri });
      }
    });
 }

render() {
  return (
   <View style={styles.container}>      
    <Button 
       style={{margin: 20}}
       onPress={this.openGallery}
       title='Open Gallery'
       backgroundColor='blue'
    />
   </View>

);

 }   
}

Its run of the mill boiler plate code. Whats going on?

@BoredKid, i get this in my console log:

for (ImagePicker):

{showImagePicker: ƒ}
showImagePicker: ƒ showImagePicker(options, callback)
__proto__: Object

for (ImagePicker.showImagePicker);

ƒ showImagePicker(options, callback) {
      if (typeof options === 'function') {
        callback = options;
        options = {};
      }

      return ImagePickerManager.showImagePicker((0, _objectS…

回答1:

Updated with new input: your ImagePicker object do not have launchImageLibrary nor launchCamera. There is a problem with you installation ... Maybe the installation didn't work properly or there is a step you made wrong. Let's try to reinstall and we'll see it the problem persist

回答2:

Instead of writing

import { ImagePicker } from 'react-native-image-picker',

you should declare ( In the same place )...

var ImagePicker = require('react-native-image-picker');

This worked for me.

回答3:

The module does not have a default export. You need to use a named export:

import * as ImagePicker from 'react-native-image-picker';

import {launchImageLibrary} from 'react-native-image-picker';

来源：https://stackoverflow.com/questions/54352838/image-picker-not-working-in-react-native-app-why

标签

reactjs

react-native