react.js - React 中，table组件中嵌入的input 在输入改变时，怎么保持焦点

问题描述

问 题

背景描述：
遇到一个需求，要求在一个<table>内部可以添加行，并且行内有<input>组件可以编辑。

我遇到的问题：
当我在行内的input组件中输入东西时，值是改变了，但是却失去了焦点。

可能的问题：
查看DOM，发现在input输入变化时，整个table 的body部分被重绘了。在我的印象中，react的脏值检查是可以找到具体变化的节点，并只对那个节点重绘。但是为什么会整个table都被重绘了。

我的反向传值方式：
每次input在onchange时，我都会把对应数据部分（即整个table的数据）做一个副本。然后在副本中找到整个变化的input的值，修改之为输入框的值。然后setState（数据副本）。

我的问题：什么原因导致焦点丢失，请问怎么避免焦点丢失?

解决方案

为啥不用onBlur呢

这篇关于react.js - React 中，table组件中嵌入的input 在输入改变时，怎么保持焦点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！