React提交API请求后.then内代码未执行，求排查原因

可能的原因及对应解决办法 #

1. API请求失败但未捕获异常

axios 的 Promise 请求如果出错（比如网络问题、后端返回错误状态码），会直接进入 catch 分支而非 then，你当前的代码没有错误捕获逻辑，导致看不到错误，误以为 then 没执行。

解决：添加错误捕获，打印错误信息
修改 onSubmit 函数：

const onSubmit = () => {
    return API.updateSomething(updateProps)
        .then(() => {
            setDisplay(false)
        })
        .catch(error => {
            console.error('API请求错误详情:', error);
            // 可在此处添加用户提示，比如弹窗告知提交失败
        })
}

打开控制台查看错误信息，就能明确请求失败的具体原因（如URL错误、参数格式不对、后端报错等）。

2. updateProps 变量未定义

你的代码里直接使用了 updateProps，但没有看到它的定义和赋值逻辑。如果这个变量是 undefined，会导致 axios 请求参数异常，后端拒绝请求，最终触发错误分支。

解决：正确定义并赋值 updateProps
结合页面中的 TextInput，推测你需要把输入的 report 值作为请求参数，先补全 report 状态定义，再构造请求参数：

const App = () => {
    const [display, setDisplay] = useState(true);
    const [report, setReport] = useState(''); // 补上缺失的状态定义

    const onSubmit = () => {
        // 根据后端接口要求构造参数，示例用report字段
        const updateProps = { content: report }; 
        return API.updateSomething(updateProps)
            .then(() => {
                setDisplay(false)
            })
            .catch(error => {
                console.error('API请求错误:', error);
            })
    }

    return (
        <>
            <TextInput
                value={report}
                onChangeText={(value) => setReport(value)}
                //...其他属性
            />
            <Icon.Button
                name="report"
                onPress={onSubmit}
            >
                提交
            </Icon.Button>
        </>
    )
}

3. 基础配置问题

• 检查 api_root_url 是否正确，确保后端服务正常运行、接口路径拼写无误；
• 移动端需确认应用已开启网络权限，web端需确认没有跨域问题（后端是否配置了CORS）；
• 检查 axios 请求是否携带了必要的请求头（比如 token、Content-Type 等），如果后端要求身份验证，未携带会导致请求失败。

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