修改搜索值时state未更新，setPokemon赋值不生效问题排查

• 引用未变化导致React跳过状态更新：当你执行setPokemon(saveDataPokemon)时，如果saveDataPokemon和当前pokemon状态的引用完全相同，React会判定状态没有发生变更，直接跳过重渲染，因此你看不到状态更新的效果。缩小搜索值时触发的是更新为{data: rangePokemonFromAttack}，每次生成的都是新对象，引用不同，所以会正常触发更新。
• 直接修改props违反单向数据流规则：你代码末尾直接对prop.props.rangeAttack的属性赋值，React的props是只读的，直接修改不会触发父组件的状态同步，会导致父子组件状态不一致，出现偶发的更新失效问题。
• 同一同步流程内多次调用同个setState会被合并：你在if分支中连续两次调用setPokemon，React会将两次更新合并，前一次的setPokemon(saveDataPokemon)会被后一次更新覆盖，属于无效代码。

1. 状态更新时传入新引用，重置saveDataPokemon时做浅拷贝保证引用变化：

// 替换原来的else分支写法
setPokemon({...saveDataPokemon})

2. 删除直接修改props的代码，改为通过父组件传入的状态更新方法修改参数：
   如果你需要重置攻击范围参数，需要父组件将对应的setter方法传递下来，通过调用方法更新，而不是直接修改props：

// 替换原有的直接赋值代码
prop.props.setRangeAttack({
  rangeAttackFrom: 0,
  rangeAttackTo: 400
})

3. 优化多余的状态更新调用，数组判空改用更规范的length判断：

if(rangePokemonFromAttack.length > 0){
  setPokemon({data: rangePokemonFromAttack})
}else{
  setPokemon({...saveDataPokemon})
}

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