通过对象以编程方式将 value prop 分配给输入答案

【问题标题】：Programmatically assign a value prop to inputs through an object通过对象以编程方式将 value prop 分配给输入
【发布时间】：2018-09-17 13:05:05
【问题描述】：

我想通过解构将它们传递到一个对象中来分配 onChange 和 value props（受控输入）。

函数 getInputProps() 返回 onChange 和 value props

getInputProps = name => {
    return {
        value: this.state.data[name],
        onChange: this.handleInput
    }
}

输入元素通过解构消耗这些道具

<input {...getInputProps('myInput')} />

但是，这不起作用，我猜这是因为该值作为“值”而不是“引用”传递给状态变量。当我将值直接作为道具时，它会起作用。在对象中传递所有必要的输入道具有哪些替代方法？

编辑：handleInput 函数正在工作，当我省略 'value' 道具时，一切都按预期工作。这是有问题的价值。以这种方式传递时，它会将实际值（即 none）传递给 HTML5 的 value 参数，并且不再是动态的。当我在对象中省略“值”时，用户输入被正确设置为状态（这就是 handleInput 所做的），但改变状态不会改变输入的值。

【问题讨论】：

that doesn't work 是什么意思？是没有为输入字段赋值还是没有反映对输入字段的更改？
请添加你的handleInput函数！
另外，如果您有错误，最好发布它们
我认为他的意思是他的onchange没有改变输入值？
工作正常：codesandbox.io/s/mm2lqq4rj8

标签： javascript reactjs

【解决方案1】：

伙计们，我找到了解决方案。这是一个简单的愚蠢错误。我正在将输入的名称和传递给函数的“名称”设置为不同的值。而handleInput 函数会根据输入的实际名称改变状态。

【讨论】：

在这种情况下，只需删除问题，因为它不太可能帮助其他人