老九的程序进阶之路

ImagePicker 选择相册

下载

react-native-image-crop-picker

npm i react-native-image-crop-picker --save

ios

你需要在Info.plist添加权限

<key>NSPhotoLibraryUsageDescription</key>
<string>相册权限</string>
<key>NSMicrophoneUsageDescription</key>
<string>麦克风权限</string>
<key>NSCameraUsageDescription</key>
<string>照相机权限</string>

在ios中pod install

android

你需要在AndroidManifest.xml中添加权限

<uses-permission android:name="android.permission.CAMERA"/>
<uses-feature android:name="android.hardware.camera" android:required="false" />
<uses-feature android:name="android.hardware.camera.front" android:required="false" />

还需要在android/app/build.gradle中如下设置

android {
  ...

  defaultConfig {
      ...
      vectorDrawables.useSupportLibrary = true
      ...
  }
  ...
}

在rn中使用

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

//上传单张照片
ImagePicker.openPicker({
  width: 300,
  height: 400,
  cropping: true
}).then(image => {
  console.log(image);
});

//上传多张照片
ImagePicker.openPicker({
  multiple: true
}).then(images => {
  console.log(images);
});

//上传视频，需要注意的是不要设置cropping: true
ImagePicker.openPicker({
  mediaType: "video",
}).then((video) => {
  console.log(video);
});

← Button(按钮) →