如何无需额外按钮，在UploadPhoto执行完成后自动调用GetReceipt函数

fetch 是异步执行的网络请求方法，你之前直接在 UploadPhoto 函数末尾调用 this.GetReceipt() 时，上传请求才刚发送，还没有完成上传逻辑，自然达不到上传完成后立刻拉取票据的效果。

把 this.GetReceipt() 调用放到 UploadPhoto 中 fetch 的成功回调里即可，同时可以修正两处可优化的问题：

• 函数入参的 pickedImagePath 被内部用 this.state.pickedImagePath 重复赋值，属于冗余代码，可根据你的实际传参逻辑保留其中一处即可
• GetReceipt 函数中请求头的 Content-Type 写错了，正确值为 application/json，避免后续出现不必要的解析异常

修改后的代码示例 #

UploadPhoto 函数修改后 #

UploadPhoto=(pickedImagePath)=> {
        // 此处原代码重复覆盖了入参，按需保留即可
        var pickedImagePath = this.state.pickedImagePath;
        console.log(pickedImagePath);
        var APIURL="http://10.0.2.2/api/postform.php";
        let uriParts = pickedImagePath.split('/');
        let image = uriParts[uriParts.length - 1];
        var ImageData= new FormData();
        ImageData.append('photo', {
            uri:pickedImagePath,
            name: image,
            type: 'image/jpeg'
        })
        
        fetch(APIURL,
            {
                headers:{
                    'Accept':'application/json',
                    'Content-Type':'multipart/form-data'
                },
                method:'POST',
                body: ImageData
            })
        .then((response)=>
        {
            console.log('succ ')
            console.log(response)
            // 上传成功后立即调用拉取票据接口
            this.GetReceipt()
        })   
        .catch((error)=>
        {
            console.log('err ')
            console.log(error)
            // 可自行添加上传失败的提示逻辑
        }
        )
    }

GetReceipt 函数修正请求头后 #

GetReceipt=()=> {
        var title = this.state.title;
        var amount = this.state.amount;
        var transactionType = this.state.transactionType;
        var note = this.state.note;
        var date = this.state.date;

        var APIURL="http://10.0.2.2/api/getform.php";

        var headers2={
            'Accept':'application/json',
            // 修正错误的Content-Type写法
            'Content-Type':'application/json'
        }

        fetch(APIURL,
            {
                method:'POST',
                headers: headers2,
               
            })
        .then((response)=>response.text()) 
        .then((response)=>
        {
            // this.setState({array:response});
            this.setState({title:response[3]});
            this.setState({amount:response[0]});
            this.setState({date:response[1]});
            this.setState({note:response[2]});
            // this.setState({results:response});
           console.log("results:",response[2]);
           console.log("merchant:",this.state.title);
           console.log("results:",response);
        })   
        .catch((error)=>
        {
            alert("Error"+error);
        }
        ) 
    }

内容的提问来源于stack exchange，提问作者Unknown