要求用户通过反应原生按钮从照片库或相机中选择照片

Question

我正在使用expo并且无法使用https://github.com/react-community/react-native-image-picker，并且想知道如何实现相同的功能。我单独为每个选项提供以下代码（一个按钮用于图库，另一个用于相机）

  _pickImage = async () => {
            let pickerResult = await Expo.ImagePicker.launchImageLibraryAsync({
              exif: true,
              allowsEditing: false,
              quality: 0.7,
              base64: true,
            })

            if (pickerResult.cancelled) {
              return
            }

            console.log(pickerResult)
  }

另一个是

uploadImage = async() =>{

       // Display the camera to the user and wait for them to take a photo or to cancel
  // the action
  let result = await ImagePicker.launchCameraAsync({
          allowsEditing: true,
          aspect: [4, 3],
        });

        if (result.cancelled) {
          return;
        }

        // ImagePicker saves the taken photo to disk and returns a local URI to it
        let localUri = result.uri;
        let filename = localUri.split('/').pop();

        // Infer the type of the image
        let match = /\.(\w+)$/.exec(filename);
        let type = match ? `image/${match[1]}` : `image`;

        // Upload the image using the fetch and FormData APIs
        let formData = new FormData();
        // Assume "photo" is the name of the form field the server expects
        formData.append('photo', { uri: localUri, name: filename, type });

        return await fetch(YOUR_SERVER_URL, {
          method: 'POST',
          body: formData,
          header: {
            'content-type': 'multipart/form-data',
          },
        });
}


}

这两个函数被称为

 <Button title="Pick image" onPress={this._pickImage} />
 <Button title="Upload image" onPress={this._uploadImage} />

但是我如何让我的工作如下所示：

Answer 1

Expo已经发布了ActionSheet库，它提供了您需要的确切功能。