我对React有点熟悉,但是我已经进入了输入问题。预设输入值并允许用户更改
我正在生成基于用户输入的输入,所以如果他们选择1,我会返回2个输入框,然后我会返回4个输入框。 另外我想用输入的数字预先填充输入框。比方说,他们是最大和最小范围
所以我有这样的事情:
minArr = [];
maxArr = [];
for (let i = 0; i < this.state.userSelectInputAmount; i++) {
minArr.push(this.calculateMin(item);
maxArr.push(this.calculateMax(item);
}
return Array(this.state.userSelectInputAmount).fill().map((_, i) => {
return (
<div className="form-group">
<label>
<input className="form-control"
placeholder="Minimum Range"
type="number"
value={minArr[i]}
step="any" />
<input className="form-control"
placeholder="Maximum Range"
type="number"
step="any"
value={maxArr[i]} />
</label>
</div>
的min
和max
是分裂,各自对用户输入 说,他们选择1
则范围可以从1 to 10
。 如果他们选择2然后1 to 5
和6 to 10
。
使用value
允许我重新选择选项,但不允许用户自定义它们自己的输入(1 to 7
而不是1-10
)。读取文档时,defaultValue不应该是一个好选择,因为我希望将来能够重新渲染(即用户输入)。有任何想法吗?
感谢您的建议,它引导我保持'价值'的道路。所以我有类似的设置,除了现在我把所有'minArr'和'maxArr'存储为一个状态,并且我可以遍历这些值。我如何设置它有什么问题。我仍然有'价值= {this.state.minArr [我]'我真的想使用'this.state.value',但它不会工作,因为我得到我的价值预加载到'minArr/maxArr' – kermitvomit
罐你更新你的问题以包含这段代码?根据你的描述,我不能完全遵循。 –
呜!所以我认为我更好地遵循了这一点,但主要关键在于使用'refs'来解析当前输入:) – kermitvomit