关与react 重新渲染的问题

业务场景：列表中存在两个输入框， 一个下拉框，和一个switch， 项目基于umi2搭建，列表数据存于model，给switch和input 分别绑定了 onClick 和  onChange 事件，他们都会执行onChangeData这个修改数据的方法，每次都会

dispatch({
      type: `${namespace}/updateStore`,
      payload: {
        tableDataSource,
      },
    });

更新model中的数据，input还绑定了onBlur失去焦点事件  会执行 checkTargetData 检查数字之间比较规则  并且也会执行 

dispatch({
      type: `${namespace}/updateStore`,
      payload: {
        tableDataSource,
      },
    });

用于更新model中的数据，

那么，问题来了，每次更改input的值，或者失去焦点，再或者点击switch，都会执行更新model中的方法，导致页面刷新，从而导致input失去焦点，和input需要点击两次才能获取焦点的问题。

问题引起的主要因素就是，重新的render，如何不让他render呢?

因为这里是列表，是map循环出来的，在react中，key如果用一样的就不会引发重新渲染（其实vue也是这样）

这个原因导致加班到没有公交回家，谨记于心！！！

 

感谢这篇文章带来的灵感：  https://blog.csdn.net/weixin_44542836/article/details/86506117?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-2.control&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-2.control