React useState设置fetch返回的新建记录ID不生效问题咨询

• Promise链式调用逻辑错误
  你当前的写法将response.json()返回的Promise嵌套在了第一层then的回调内部，且没有主动返回这个Promise，导致外层后续的.then(() => console.log(newID))不会等待内部的接口响应解析逻辑执行完成就提前触发，此时setNewID还未执行，newID自然还是初始值undefined。
• React useState更新机制的特性
  React的useState返回的状态更新函数是异步执行的，就算你修正了Promise的等待逻辑，在同一个执行上下文中调用setNewID之后，立刻访问newID拿到的还是当前闭包缓存的旧值，更新后的状态要等到组件下一次重渲染之后才可以获取到，所以你在fetch的then链里永远读不到刚更新的newID。

你补充提问里的写法完全可行，不需要额外定义newID状态做中转，直接在拿到接口返回的id后调用navigate即可，这是更简洁合理的实现方式。
你也可以把Promise链铺平，减少嵌套提升可读性：

fetch('https://localhost:44326/api/Players/post', {
  method: 'POST',
  headers: {
    Accept: 'application/json',
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    handle: data.handle,
    role: data.role,
    avatar: linkToAvatar,
  }),
})
.then(response => response.json())
.then(data => {
  // 直接使用返回的id跳转，不需要额外存状态
  navigate('../Stats/', { state: { userID: data.id } })
})
.catch(err => console.error('请求出错：', err))

如果你确实需要把id存入状态用于其他渲染逻辑，直接在拿到数据后同时执行更新状态和跳转即可，不需要在后续的then中访问状态：

.then(data => {
  setNewID(data.id)
  navigate('../Stats/', { state: { userID: data.id } })
})

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