输入没有问题,但是我需要将输入代码移到一个函数中。现在我只能在输入值中键入一个单词。不确定解决这个问题的方法是什么。我的排序函数也有类似的问题。
这是我的代码https://codesandbox.io/s/sweet-murdock-5uqfxs?file=/src/App.js的链接
我为输入创建了另一个函数,但仍然没有运气。
输入没有问题,但是我需要将输入代码移到一个函数中。现在我只能在输入值中键入一个单词。不确定解决这个问题的方法是什么。我的排序函数也有类似的问题。
这是我的代码https://codesandbox.io/s/sweet-murdock-5uqfxs?file=/src/App.js的链接
我为输入创建了另一个函数,但仍然没有运气。
2条答案
按热度按时间efzxgjgh1#
这是因为你在
App
组件内部定义了MyInput
组件,所以在每次重新渲染App
时,它都会创建一个新的MyInput
组件,这样它就会失去焦点,你需要重新聚焦输入。在
App
之外定义MyInput
组件以使其稳定将解决这些问题。您必须通过props传递所需的值和处理程序。通常,由于这类问题,在其他组件内部定义组件是一种不好的模式。
nwlqm0z12#
你的代码很脏,读起来很痛苦。
你几乎在任何地方都使用了不必要的 prop 。你的应用程序基本上是一个购物清单。应用程序创建和读取数据-只有两个功能。
此外,您还不必要地将基本应用程序组合成主应用程序组件中的多个组件。因此,您的
inputValue
状态无法准确Map到MyInput中的username
。建议:组织你的状态变量并减少组件的组成。
我不想无礼,但是你的代码没有组织,读起来很痛苦。