我正在学习React并尝试构建一个Form组件来提交数据,我以表单中的handling multiple inputs引用了react官方文档。
从示例代码中可以看到,它在每个输入元素上定义了onChange={this.handleInputChange}
,我试图将onChange
事件提升到form
元素本身,就像{{1} }并从每个输入元素中删除它们,然后基于<form onChange={this.handleInputChange} >
事件可以冒泡的情况下,它可以很好地工作。
但是我想知道这种方式是否有副作用,因为在Internet上搜索时我没有看到太多这样的代码,而且大多数关于React形式的文章在React的文档中都使用相同的方式。
更新:
我根据以下React网站的示例创建了一个MyForm组件,
https://codepen.io/Lenient/pen/PyLwxp?editors=0010
请注意,我将change
事件放入了form元素。如果您打开开发人员工具,您会在控制台中看到两条警告消息。这是消息之一。
警告:道具类型失败:您向没有
onChange
处理程序的表单字段提供了value
道具。这将呈现一个只读字段。如果该字段是可变的,请使用onChange
。否则,请设置defaultValue
或onChange
。
我不太清楚,任何人都可以举个例子来帮助我理解它吗?