嘿，这两个问题都是Promise和axios使用中很典型的小坑，我来给你逐个梳理清楚：

其实核心是Promise的执行机制在起作用，大概率是你写法上的小疏忽导致了顺序误解：

• 首先，Promise构造函数里的代码是同步执行的，但.then/.catch这类回调是被放到微任务队列里，要等当前同步代码全部跑完才会触发。
• 如果你觉得.then在resolve前执行，90%的可能是你没把.then的回调写成函数！比如你直接写了.then(console.log('then跑了'))，而不是.then(() => console.log('then跑了'))——这种情况下，括号里的代码会立刻同步执行，根本不会等resolve触发。

举个错误和正确的对比：

// ❌ 错误写法：then里的代码直接同步执行
new Promise((resolve) => {
  setTimeout(() => {
    console.log('resolve触发');
    resolve();
  }, 1000);
}).then(console.log('then先跑了'));
// 输出顺序：then先跑了 → resolve触发

// ✅ 正确写法：then回调等待resolve
new Promise((resolve) => {
  setTimeout(() => {
    console.log('resolve触发');
    resolve();
  }, 1000);
}).then(() => console.log('then后跑了'));
// 输出顺序：resolve触发 → then后跑了

你可以检查下自己的代码，是不是犯了这个没给.then传函数的错误。

你的代码问题出在第二个.then的写法上，先看你的错误代码：

axios.post('http://localhost:5000/exercises/add', exercise)
  .then(res => console.log(res.data))
  .then(window.location.href = '/') // 这里是核心错误！
  .catch(err => console.log(err))

这里的window.location.href = '/'是同步赋值操作，会立刻执行——浏览器会马上跳转到/页面，直接中断了还在处理中的POST请求，所以请求发不出去。

修复方法超级简单：把跳转逻辑用箭头函数包裹起来，让它作为Promise的回调，等请求真正完成后再执行：

// ✅ 修复写法1：拆分then
axios.post('http://localhost:5000/exercises/add', exercise)
  .then(res => {
    console.log(res.data);
  })
  .then(() => {
    // 用函数包裹，等前一个then完成再跳转
    window.location.href = '/';
  })
  .catch(err => console.log(err))

或者更简洁的写法，把跳转放到第一个.then里：

// ✅ 修复写法2：合并逻辑
axios.post('http://localhost:5000/exercises/add', exercise)
  .then(res => {
    console.log(res.data);
    window.location.href = '/'; // 请求成功后再跳转
  })
  .catch(err => console.log(err))

为啥这样就没问题？因为.then必须接收一个函数作为参数，只有当前一个Promise状态变为resolved（也就是请求成功完成）时，这个函数才会被调用。之前的写法相当于直接把跳转的结果传给了.then，不符合Promise的API要求，还直接中断了请求。

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