如何使用 Reactjs 用组件的状态填充模态表单

How to populate modal form with a component's state with Reactjs?

本文关键字：状态填充模态表单组件何使用 Reactjs 更新时间：2023-09-26

我有许多从父组件渲染的子 React 组件，单击每个组件的名称后，我希望能够编辑被单击的特定组件的状态，但是我不确定如何最好地将当前状态"传递"到模态中，以便可以在模态上的表单中编辑它们。

我见过在单击后使用 jquery (.val((( 设置模态字段的实现，这似乎不像是执行此操作的惯用反应方式。

我应该如何从特定组件预填充模态字段，以及模态应该准确地呈现在哪里？

根据您使用的模态，您应该简单地使用 props 将这些值填充到模态组件中。您可以创建一个更通用的模态组件并将该模态提供给您的道具，或者如果您认为无法创建一个适合比此特定用例更多用例的通用模态，则可以创建一个特定的模态。很难在不看到/知道您使用哪一个的情况下给出代码示例，但是下面的链接 react-bootstrap 的模态实现可能会对您有所帮助！

React-bootstrap 对 Bootstrap 模态的实现。