Reactjs - 为什么我的输入字段在放入函数组件时没有响应?

Question

考虑以下 2 行：

<input name='workMinute1' value={workMinute} onChange={changeHandler} />

<Label name='workMinute' value={workMinute} />

他们基本上在做同样的事情，但第二行来自：

function Label(p) {
return (
<input name={p.name} value={p.value} onChange={changeHandler} />
)
};

结果：尝试键入时，第二行中的输入框将没有响应。

我可以找到相关的答案，但我找不到一个简洁的答案来描述与这个问题相关的 React 的内部工作。

Answer 1

假设你的changeHandler看起来像这样：-

function changeHandler(e){
setValue(e.target.value);
}

您的标签组件声明应为：-

<Label name='workMinute' value={workMinute} changeHandler={changeHandler}/>

因此，您更新的组件将是：-

function Label(p) {
return (
<input name={p.name} value={p.value} onChange={p.changeHandler} />
)
};