React Native中setState未更新状态，回调内也无变化

我遇到的问题是，user_res已更新，但state并未更新。我尝试过将该函数绑定到this，但结果依旧。相关代码如下：

let user_res = usr_vote; 
user_res.map((vote)=>{ 
  if(vote.id==dat_id){ 
    vote.status = stats 
  } 
}) 
console.log("update user response:",user_res) 
this.setState({user_response:user_res},()=>{ 
  console.log("but this is not updating : ",this.state.user_response) 
}); 

在setState的回调函数中打印state，发现状态仍未更新。

问题根源：你在修改原引用，没有创建新的状态副本 #

这里的核心问题是let user_res = usr_vote;这行代码——它只是让user_res指向了usr_vote的同一个数组引用，你后续修改数组里的元素时，并没有改变数组本身的引用地址。

React的状态更新机制依赖于引用变化：当你传入setState的新状态和旧状态引用相同时，React会认为状态没有发生改变，因此不会触发组件重新渲染，连回调里拿到的也还是旧的状态引用。

解决办法：创建新的数组/对象副本，让React识别到状态变化 #

你需要通过创建新的数组和对象副本，来打破原有的引用关系，这样React才能正确检测到状态更新。推荐两种常用写法：

写法一：用map返回新对象（简洁高效）

遍历原数组，对需要修改的项返回新对象，其他项保持不变：

const updatedUserRes = usr_vote.map(vote => {
  // 只对目标项创建新对象，修改status属性
  if (vote.id === dat_id) {
    return { ...vote, status: stats };
  }
  // 其他项直接返回原对象即可
  return vote;
});

console.log("update user response:", updatedUserRes);
this.setState({ user_response: updatedUserRes }, () => {
  console.log("updated state:", this.state.user_response);
});

写法二：先复制数组再修改（适合复杂操作）

如果需要做更多数组操作，可以先通过展开运算符复制出一个新数组，再找到目标项替换为新对象：

// 展开原数组，创建一个全新的数组副本
const user_res = [...usr_vote];
// 找到需要修改的项的索引
const targetIndex = user_res.findIndex(vote => vote.id === dat_id);

if (targetIndex !== -1) {
  // 替换为新对象，不修改原对象
  user_res[targetIndex] = { ...user_res[targetIndex], status: stats };
}

console.log("update user response:", user_res);
this.setState({ user_response: user_res }, () => {
  console.log("updated state:", this.state.user_response);
});

这样修改后，你传入setState的是一个全新的数组引用，React会立刻识别到状态变化，正确更新state并执行回调函数。

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