问题标签 [react-forms]

我创建了一个带有文件输入和文本字段的字段数组。一切似乎都很好，但是当我尝试上传小图像或在文本字段中输入内容时，会弹出一个类型错误，并显示“onChange 不是函数”消息。如何修复此错误？

我已将代码上传到代码沙箱： https ://codesandbox.io/s/cool-wildflower-6jlcl?file=/src/App.js

我有一个包含 100 多个数据的循环数据数组，我使用 map 方法来渲染它已经定义的用户只能更新具有 id 和唯一 id 的特定字段我现在需要能够编辑/提交它们是唯一独立的字段。所有字段都应该是一些默认值。目前，我还没有弄清楚如何区分它们 onChange 导致所有字段的状态相同。我需要每个字段分别使用其唯一数据进行更新，并且我正在使用由地图呈现的反应挂钩输入表单。这些是我想要唯一更新字段的表单。

请给出任何有助于实施的想法或建议如何解决这个问题我是新手，请帮助我们

感谢帮助

codesandoxLink：https ://codesandbox.io/s/react-week-date-view-r3mvj?file=/src/App.js

我试图让我的下拉选项在我更新我的friends. 为了提供有关我的代码的上下文以及我的问题是在另一个名为 的组件上发生了什么Friends，我渲染了朋友卡，每张卡都有一个更新按钮。如果单击该更新按钮，则路由路径将更改为"/AddFriend/{id}"导致我的AddFriend组件呈现的路径，然后我使用从组件传递的 id在组件中进行 ajax 调用 ( getById)以获取有关该特定信息的所有信息朋友并用该信息填充我的表单。我所有的表单输入字段都正确填充了正确的AddFriendFriendsfriendfriend的信息，但我的问题是我作为下拉列表（不是输入字段）的 statusId。现在我可以更改value选项标签上的属性以反映它在其中包含的值：

因此，如果我将选项标签从更改为看起来<option value="NotSet">NotSet</option>而不是<option value="1">NotSet</option>那样会导致我的下拉菜单选择正确的值，但我的导师说我需要这些值是数字（表示为字符串）。

因此，例如，假设friend我单击的谁的编辑按钮有一个statusIdof "Active"，我希望我的应用程序知道这一点，因为我statusId是"Active"然后我的下拉列表的选定值需要是<option value="2">Active</option>。

你好我是新来的反应。我正在做一个反应作业，我可以在其中使用表单添加学生详细信息。在另一个页面中，我正在显示学生列表，每个列表元素中只显示学生姓名。现在单击特定列表元素，我应该能够收集其索引，并且还应该能够使用重定向到该特定学生表单的编辑页面

我重新设计了页面上的表格。我用 react-hook-form 重写了它。

新 API 尚未准备好，我无法在不重新加载的情况下提交表单。那么如何用这个库来确认这一点呢？我可以用 POST 方法制作表格吗？

我正在为我的一个项目使用数据选择器，并尝试使用 yup 进行验证。但我要显示一条错误消息，但在选择日期后它不会隐藏。任何帮助深表感谢。

这是我的架构

我有一个网站，我正在使用我构建的表单构建。

这是代码：

但是，当用户提交表单时，他们可以继续按下订阅按钮，这让我提交了很多内容。

如何阻止人们重新提交？并且只提交一次。

我认为使用 preventDefault 会阻止这种情况发生，但仍然找不到解决方案。

提前致谢！

我无法在添加和编辑模式下使用相同的表单组件。我能够在编辑模式下填充表单组件上的值，但无法在输入字段中输入具有现有值的内容。每当我们有 id 时，我都会触发 redux 操作，以便他可以获得单个联系人详细信息，并且从 reducer 我提取联系人状态并检查每个输入字段，如果它处于编辑模式，则显示来自 reducer我们有喜欢的contact.name，contact.email之类的。使用这种方法，我可以在每个输入字段上填充现有值，但无法输入内容您能看看下面的代码，这种方法有什么问题吗？

我已经使用 useState 方法创建了这种受控方式的版本，该方法运行良好，但是在练习和学习 useRef 时，我尝试使用 useRef 创建一个新版本。它大部分工作正常，但是当将 ref 重置为空字符串（重置表单输入字段）时，它将我的输入数据永久设置为空输入，因此返回的第一个列表项很好，但后续列表项只是空的。无论我在 App 函数中为 ref 提供空字符串值还是在 Form 组件中传递函数后，都会发生这种情况。

这是我尝试的地方：https ://codesandbox.io/s/simple-react-userlist-werrormessage-forked-useref-version-resetinputdoesntworkcorrectly-0wsze?file=/src/App.js

应用程序.jsx：

表单.jsx：

使用基于类的组件，我们对多个输入字段这样做

但我想用钩子来做：

我知道如何为每个单独的字段执行此操作，但我想像在基于类的组件中那样编写通用代码，这样我就不必为每个字段重复。