React Bootstrap 表单按钮内联

【问题标题】：React Bootstrap form button inlineReact Bootstrap 表单按钮内联
【发布时间】：2021-02-12 19:53:08
【问题描述】：

任何添加类似内容的方法

（内联搜索表单）在引导程序中？

【问题讨论】：

标签： javascript reactjs bootstrap-4 react-bootstrap

【解决方案1】：

你可以这样做：

<form class="form-inline my-2 my-lg-0">
  <button class="btn btn-outline-success my-2 my-sm-0" type="submit"><i class="fa fa-search"></i></button>
  <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
</form>

使用 React-Bootstrap：

<Form inline>
  <Button variant="outline-success"><i class="fa fa-search"></i></Button>
  <FormControl type="text" placeholder="Search" className="mr-sm-2" />
</Form>

fontawesome 库中的图标

【讨论】：

比以前好多了！但是当我进入移动视图时，按钮会出现在表单下方