无法在 React Bootstrap 的选项卡中使用表单答案

【问题标题】：Unable to use Form inside tabs in ReactBootstrap无法在 React Bootstrap 的选项卡中使用表单
【发布时间】：2020-10-05 23:19:51
【问题描述】：

render(){
return(<div>
<Tabs defaultActiveKey="profile" id="uncontrolled-tab-example">
<Form>  
<Tab eventKey="home" title="Home">
    <input type="text" name="name"/>
  </Tabs>
  <Tab eventKey="profile" title="Profile">
    <input type="text" name="age"/>
  </Tab>
  <Tab eventKey="contact" title="Contact" disabled>
    <button type="submit">Submit</button>
  </Tab>
</Form>
</Tabs></div>);
}

无法在 ReactBootstrap 的选项卡中使用表单。 Tab 组件不应该被渲染！它是一个抽象组件，仅作为Tabs 组件的直接子组件有效。对于自定义选项卡组件，直接使用 TabPane 和 TabsContainer。这对我来说非常重要。我需要以不同形式划分的整个表格谢谢

【问题讨论】：

你试过用
包裹整个吗？
是的。我只试过这样。我需要在单独的选项卡中单独输入表单
我问过你有没有把表格放在标签上面。在您的示例中，表单位于选项卡内。因此，将
上移一行，并将
移到和
之间，这样就可以了。

标签： javascript reactjs react-native ecmascript-6

【解决方案1】：

您的结束标记中有错字。也许这会导致错误：

<Tab eventKey="home" title="Home">
    <input type="text" name="name"/>
</Tabs>

【讨论】：

【解决方案2】：

你应该在 Tabs 组件中有 Tab。

请找到关于如何使用选项卡和选项卡的示例输出的屏幕截图。

【讨论】：

亲爱的先生，我仍然遇到同样的错误。我只想在所有选项卡中呈现一个表单
我想了解这里的用例。您希望一个表单显示在所有选项卡中吗？
希望这会有所帮助。 codesandbox.io/s/stoic-microservice-ru9v1?file=/src/App.js
尊敬的先生，不是这样但是一个表单应该在所有选项卡中呈现。在我的一段代码中，一个输入框在第一个选项卡中，另一个输入框在第二个选项卡中，提交按钮在第三个选项卡中，并且在该表单标签关闭之后。我想要那样