如何使用 react-native-camera 包获取加载的 Nosuitable image URL 为 null 捕获图像

Posted 2023-03-11

【中文标题】如何使用 react-native-camera 包获取加载的 Nosuitable image URL 为 null 捕获图像

【英文标题】：How can I capture an image using react-native-camera package getting Nosuitable image URL loaded found for null

【发布时间】：2019-12-16 10:13:52

【问题描述】：

我使用 rn-camera 单独拍摄照片。但是在更新后它不能正常工作并且加载了 Nosuitable 图像 URL 后发现为空。任何人都可以建议我解决这个问题吗？我的代码在下面

       <View>
        <Camera
          ref=(cam) => 
            this.camera = cam
          
          style=styles.view
         // aspect=Camera.constants.Aspect.fill
          >
        </Camera>
      </View>
        <Icon style =  alignSelf:'center' onPress=this.takePicture.bind(this) name="camera" size=50/>
  </View>

  takePicture() 
    const options = 
    this.camera.takePictureAsync(metadata: options).then((data) => 
        ImagePicker.openCropper(
          path: data.path,
          width: deviceWidth,
          height: deviceWidth*5/4,
          cropperToolbarTitle: '',
          hideBottomControls: true,
          enableRotationGesture: true
        ).then(image => 
          this.props.screenProps.navigation.navigate(this.props.screenProps.navigation.state.params.screenName, uri: image.path)
        )
        .catch((err) => 
          console.log("openCropper error = " + err)
        );
    ).catch((error) => 
      console.log(error)
    )
  

【参考方案1】：

您必须使用 data.uri，imagePicker 需要 uri，其中包含您需要使用裁剪器的所有详细信息，或者您也可以使用“react-native-image-crop-picker”。

ImagePicker.openCropper(
              path: data.path, // Add the data.uri here 
              width: deviceWidth,
              height: deviceWidth*5/4,
              cropperToolbarTitle: '',
              hideBottomControls: true,
              enableRotationGesture: true
            ).then(image => 
              this.props.screenProps.navigation.navigate(this.props.screenProps.navigation.state.params.screenName, uri: image.path)
            )
            .catch((err) => 
              console.log("openCropper error = " + err)
            );