You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Save Data按钮点击后API未立即执行,需触发其他UI操作才完成的问题求助

Save Data按钮点击后API未立即执行,需触发其他UI操作才完成的问题求助

大家好,我遇到了一个非常诡异的问题,想请各位帮忙排查下:

我开发的界面里有个「Save Data」按钮,点击它本应立刻触发下面代码里的sendEsevaKendraData异步函数来发起API请求,但实际情况是,点击按钮后API调用好像卡住了,完全没动静,只有当我去点击另一个UI元素(比如页面上的「Court Complex」按钮)之后,这个API请求才会突然完成。

我已经确认过API调用的逻辑本身是正确的,但就是第一次点击「Save Data」按钮时不按预期立即执行。下面是相关的代码片段:

const sendEsevaKendraData = async () => {
  console.log("Clicked Save with:", { selectedItem, imageUri, latitude, longitude });
  if (!selectedItem || !imageUri || !latitude || !longitude) {
    ToastAndroid.show('Incomplete data. Please complete all steps.', ToastAndroid.LONG);
    return;
  }
  setLoadingSave(true);
  setTimeout(async () => {
    try {
      const esevaId = selectedItem.eseva_id;
      const imageName = `${esevaId}.jpg`;
      const fullData = {
        eseva_id: esevaId,
        latitude,
        longitude,
        filename: imageName,
        mobile_no: selectedItem.mobile_no ?? '',
      };
      const encrypted = encryptData(fullData); // Assume this returns { data: string }
      const formData = new FormData();
      formData.append('data', encrypted.data);
      formData.append('img', {
        uri: imageUri,
        name: imageName,
        type: 'image/jpeg',
      });
      const response = await fetch('<API_ENDPOINT>', {
        method: 'POST',
        headers: {
          'Content-Type': 'multipart/form-data', // 这里我是不是应该去掉这个头,让fetch自动设置boundary?
        },
        body: formData,
      });
      const textData = await response.json();
      const json_response = decryptData(textData);
      if (json_response?.status === 'Y') {
        Alert.alert('✅ Success', json_response.message);
      } else {
        ToastAndroid.show(json_response.message ?? 'Unexpected response', ToastAndroid.LONG);
      }
    } catch (err) {
      console.error("❌ Upload error:", err);
      Alert.alert('Error', 'Failed to upload data');
    } finally {
      setLoadingSave(false);
    }
  }, 0);
};

目前我自己有几个疑惑点:

  • 手动设置multipart/form-data请求头会不会有问题?是不是应该去掉这个头,让fetch自动生成带boundary的请求头?
  • 用setTimeout(async () => {}, 0)包裹整个请求逻辑,会不会影响异步任务的执行时机,导致它被阻塞了?

希望有经验的朋友能帮我分析下问题出在哪里,谢谢大家!

内容来源于stack exchange

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.04.07 11:05:28