react-native-image-picker vs expo ImagePicker [英] react-native-image-picker vs expo ImagePicker

问题描述

我已经尝试了很多尝试来提高react-native-image-picker并与我的RN应用程序一起使用.我正在使用Expo和VS Code，但未在Xcode或Android Studio上运行该应用程序.在应用程序中提供相机胶卷似乎有很多选择，但我不确定这是最佳途径.似乎没有一个对我有用，因此我想选择最佳路径并专注于使这条路径有效.

I have tried many attempts to get react-native-image-picker up and working with my RN app. I am using Expo and VS Code and am not running the app with Xcode or Android Studio. There seems to be many options to getting the camera roll available in an app and I am not sure which is the best path to take. None seem to be working for me so I would like to pick the best path and focus on making that one route work.

我正在关注文档: https://github.com/react-native-community/react-native-image-picker

我尝试过的事情:

• 反应本地相机胶卷
• Expo ImagePicker
• expo-image-picker
• 本机图像选择器
• react-images-upload
• native-photo-upload

我的代码:

import React, {useState, useEffect} from 'react';
import {StyleSheet, View, TextInput, TouchableOpacity, Text, CameraRoll } from 'react-native'
import ImagePicker from 'react-native-image-picker';
// import * as ImagePicker from 'expo-image-picker';
import Constants from 'expo-constants';

const PicturesScreen = ({navigation}) => {
    const [pictures, setPictures] = useState([]);

getPermissionAsync = async () => {
    if (Constants.platform.ios) {
      const { status } = await Permissions.askAsync(Permissions.CAMERA_ROLL);
      if (status !== 'granted') {
        alert('Sorry, we need camera roll permissions to make this work!');
      }
    }
};

useEffect(() => {
    getPermissionAsync();
}, []);

selectPhotoTapped = () => {
   const options = {
      quality: 1.0,
      maxWidth: 500,
      maxHeight: 500,
      storageOptions: {
        skipBackup: true,
      },
    };

    ImagePicker.showImagePicker(options, 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 {
        let source = {uri: response.uri};
        console.log('source: ' + source);
        // You can also display the image using data:
        // let source = { uri: 'data:image/jpeg;base64,' + response.data };

        setPictures({
          picture: source
        });
      }
    });
  };


return (
    <View style = {styles.container}>
        <TouchableOpacity style = {styles.buttonContainerPhoto} onPress={()=> selectPhotoTapped()}> 
            <Text style={styles.buttonText} >
                Upload Photos 
            </Text>
        </TouchableOpacity> 

    <TouchableOpacity style = {styles.buttonContainer} onPress={()=> navigation.navigate('NextScreen')}> 
            <Text style={styles.buttonText} >
                Next 
            </Text>
        </TouchableOpacity>
    </View>
    );
};

const styles = StyleSheet.create({
    container: {
        ...
    }
});

export default PicturesScreen; 

我已确保链接软件包，我也已卸载并重新安装并从头开始了几次.我已对该版本降级以使其正常运行，但仍继续收到以下错误消息之一:

I have made sure to link the packages, I have also uninstalled and reinstalled and started from scratch a few times. I have downgraded the version to make it work but I still continue to get one of these error messages:

react-native-image-picker:NativeModule.ImagePickerManager为空

react-native-image-picker: NativeModule.ImagePickerManager is null

或

无法读取未定义的属性'showImagePicker'.

Can not read property 'showImagePicker' of undefined.

或

未定义不是对象(正在评估'imagepickerManager.showimagepicker')

undefined is not an object(evaluating 'imagepickerManager.showimagepicker')

是否由于使用Expo而引起问题?我应该只将CameraRoll与react-native一起使用吗?

Is it causing issues because I am using Expo? Should I just be using CameraRoll with react-native?

推荐答案

使用 expo-image-picker (如果您使用的是Expo.)

Use expo-image-picker if you're using Expo.

任何需要使用 react-native链接的内容都不适用于Expo，除非声明已包含在Expo中.

Anything that requires the use of react-native link will not work with Expo, unless stated that it is already included in Expo.

这篇关于react-native-image-picker vs expo ImagePicker的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！