*可能的未处理的承诺拒绝（id：0）：类型错误：undefined不是一个对象（显示为'result.cancelled'）Cloudinary图像上传

Question

有人可以帮我吗。我有这个项目，我必须将图像上传到cloudinary。这里的问题是可能的未处理的承诺拒绝（id：0）：类型错误：undefined不是一个对象（显示'result.cancelled']，有人可以帮助我吗？

这是我的构造函数

    constructor(props) {
  super(props);
this.state = {
  image: '',
  receiptamount: '',
  driverusername: '',
  requesterusername: '', 
  avatarSource: '',
};
}

这是我的职能

    pickImage = async () => {
      let result = await ImagePicker.showImagePicker(options, (response) => {
        console.log('Response = ', response);

        if (response.didCancel) {
          console.log('User cancelled image picker');
        } else if (response.error) {
          console.log('ImagePicker Error: ', response.error);
        } else if (response.customButton) {
          console.log('User tapped custom button: ', response.customButton);
        } else {
          const source = { uri: 'data:image/jpeg;base64,' + response.data }

          this.setState({
            image: 

response.uri,
      });
      console.log( {uri: response.uri});
      // You can also display the image using data:
      // const source = { uri: 'data:image/jpeg;base64,' + response.data };

      this.setState({
        avatarSource: source,
      });
    }
  });

    if (!result.cancelled) {


        // url generation via cloudinary
        let base64Img = this.state.avatarSource;

        //Add your cloud name
        let apiUrl = 'https://api.cloudinary.com/v1_1/kusinahanglan/image/upload';

        let data = {
          file: base64Img,
          upload_preset: 'bgzuxcoc',
          cloud_name : 'kusinahanglan',
        };

        fetch(apiUrl, {
          method: 'POST',

      body: JSON.stringify(data),
      headers: {
        'content-type': 'multipart/form-data',
      },

    }).then(r => {
      data = r._bodyText;
      console.log('data value:' + data)
      // uploads url to image as generated from cloudinary
      firebase.database().ref('receipts/' + this.state.requesterusername).set({
        imagename: JSON.parse(r._bodyText).public_id + "." + JSON.parse(r._bodyText).format,
        imageurl: JSON.parse(r._bodyText).secure_url,
        receiptamount: this.state.receiptamount,
        driverusername: this.state.driverusername,
        requesterusername: this.state.requesterusername,

        });
    });
  }
};



render() {
  return (
    <View style={styles.container}>

                            <TextInput
        value1={this.state.receiptamount}
        placeholder = "receipt amount"
        onChangeText = {(value1) => this.setState({receiptamount:value1})}
        />

                                    <TextInput
        value2={this.state.driverusername}
        placeholder = "driver username"
        onChangeText = {(value2) => this.setState({driverusername:value2})}
        />

                                      <TextInput
        value3={this.state.requesterusername}
        placeholder = "requester username"
        onChangeText = {(value3) => this.setState({requesterusername:value3})}
        />

      <TouchableOpacity
        onPress={() => this.pickImage()}
        style={{ width: 200, alignSelf: 'center' }}>
        <View style={{ backgroundColor: 'transparent' }}>
          {this.state.image
            ? <Image
                source={{ uri: this.state.image }}
                style={{
                  width: 200,
                  height: 200,
                  borderRadius: 100,
                  alignSelf: 'center',
                }}
              />
            : <View
                style={{
                  backgroundColor: 'grey',
                  width: 200,
                  height: 200,
                  borderRadius: 100,
                }}
              />}


        </View>
      </TouchableOpacity>
    </View>
  );
}
}

const styles = StyleSheet.create({
container: {
  flex: 1,
  alignItems: 'center',
  justifyContent: 'center',

  backgroundColor: '#ecf0f1',
},
});

Answer 1

ImagePicker的结果将是不确定的，因为库在那里不返回任何内容。将您的代码放入response.didCancel中。

let result = await ImagePicker.showImagePicker(options, (response) => {
    console.log('Response = ', response);

    if (response.didCancel) {
      console.log('User cancelled image picker');

    // url generation via cloudinary
    let base64Img = this.state.avatarSource;

    //Add your cloud name
    let apiUrl = 'https://api.cloudinary.com/v1_1/kusinahanglan/image/upload';

    let data = {
      file: base64Img,
      upload_preset: 'bgzuxcoc',
      cloud_name : 'kusinahanglan',
    };

    fetch(apiUrl, {
      method: 'POST',
      body: JSON.stringify(data),
      headers: {
        'content-type': 'multipart/form-data',
      }
    }).then(r => {
      data = r._bodyText;
      console.log('data value:' + data)
      // uploads url to image as generated from cloudinary
      firebase.database().ref('receipts/' + this.state.requesterusername).set({
    imagename: JSON.parse(r._bodyText).public_id + "." + JSON.parse(r._bodyText).format,
    imageurl: JSON.parse(r._bodyText).secure_url,
    receiptamount: this.state.receiptamount,
    driverusername: this.state.driverusername,
    requesterusername: this.state.requesterusername,

    });
});
    } else if (response.error) {
      console.log('ImagePicker Error: ', response.error);
    } else if (response.customButton) {
      console.log('User tapped custom button: ', response.customButton);
    } else {
      const source = { uri: 'data:image/jpeg;base64,' + response.data }

      this.setState({
        image: response.uri,
  });
  console.log( {uri: response.uri});
  // You can also display the image using data:
  // const source = { uri: 'data:image/jpeg;base64,' + response.data };

  this.setState({
    avatarSource: source,
  });
}

}）;