React useState首次运行未返回预期true反而返回false问题求解

• React 状态更新为异步操作：调用UploadStateSetState后，React 不会立即修改当前作用域下的uploadStatus变量，本次事件回调执行过程中拿到的仍然是更新前的旧值。如果你是在调用更新方法后立即读取uploadStatus做判断，自然会拿到初始的"false"，出现符合匹配逻辑但结果不符合预期的问题。
• 状态类型不规范：你用了字符串"false"/"true"作为状态值，而非原生布尔值。如果后续逻辑中直接用if(uploadStatus)做隐式判断，非空字符串会被识别为真值，容易引发逻辑错误。
• 严格匹配规则问题：Array.includes执行的是严格相等匹配，只要selectedFile[i].people和数组内的目标值存在大小写差异、首尾空格、特殊字符差异，都会匹配失败。

1. 调整状态类型为布尔值，避免字符串判断的潜在问题：

// 初始化用布尔值
const [uploadStatus, setUploadStatus] = useState(false)

const onSubmittt = (e) => {
  e.preventDefault() 
  for (let i = 0; i < selectedFile.length; i++) {
    if (dataFromServer.name.includes(selectedFile[i].people)) { 
      setUploadStatus(true)
      break; 
    }
  }
}

2. 如果需要在状态更新完成后执行后续逻辑，通过useEffect监听状态变化触发回调：

// 当uploadStatus变化时会触发该回调，此时拿到的是最新值
useEffect(() => {
  // 此处写状态更新后要执行的逻辑，比如提交接口、打印结果等
  console.log('当前上传状态：', uploadStatus)
}, [uploadStatus])

3. 可选：匹配前对字符串做归一化处理，避免大小写、空格导致的匹配失败：

const targetName = selectedFile[i].people.trim().toLowerCase()
const isMatch = dataFromServer.name.some(name => name.trim().toLowerCase() === targetName)
if (isMatch) {
  setUploadStatus(true)
  break
}

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