跳至主要内容

迁移到 v2

React-Bootstrap v2 完全兼容 Bootstrap 5。由于 Bootstrap 5 是该项目的重大重写，因此与 React-Bootstrap v1 相比存在重大更改。

请首先阅读上游 Bootstrap 迁移指南

查看迁移指南

React-Bootstrap 仅包含原生 Bootstrap 中存在的组件。如果 Bootstrap 中的功能被移除，那么它也会从 React-Bootstrap 中移除。本指南不会重复上游迁移指南中的信息。其目标是记录 React-Bootstrap 特定的 API 更改和新增内容。

版本控制​

我们将继续为 Bootstrap 4 组件提供一般维护，因为许多项目仍然依赖于 react-bootstrap 中的 Bootstrap 4 支持。react-bootstrap 包版本将如下所示

  • Bootstrap 3 支持将继续在 react-bootstrap 版本 < v1.0.0 中提供
  • Bootstrap 4 支持将在 react-bootstrap 版本 >= v1.0.0 中提供
  • React-Bootstrap 版本 >= v2.0.0 将支持 Bootstrap 5。

我们不会承诺与 Bootstrap 主要版本保持同步，以避免出现重大更改。根据项目的最佳方案，可能会出现针对 Bootstrap 6 的 React-Bootstrap v3 版本。

从 v1.x 开始的重大更改摘要​

以下是 API 更改的粗略说明，以及迁移所需的最小更改。

一般​

  • 现在需要 React >= 16.14.0 来支持新的 JSX 转换。

手风琴​

  • 手风琴不再基于卡片，并且已使用不同的标记重写。
  • AccordionContext 的值接口已更改。
  • AccordionToggle 已重命名为 AccordionButton。
  • useAccordionToggle 已重命名为 useAccordionButton。

徽章​

  • variant 已重命名为 bg。

按钮组​

  • 删除了 toggle。

卡片列​

  • 删除了 CardColumns。

关闭按钮​

  • 删除了 label 属性，改为使用 aria-label。
  • 添加了 variant 属性。

列​

  • ColOrder 现在最大为 5，而不是 12。
  • 在断点属性中使用对象时，span 默认不再为 true。
  • 下拉菜单分隔符默认使用 hr 而不是 div。
  • 对齐值 left 和 right 分别更改为 start 和 end。
  • 删除了 alignRight。请改用 align="end"。
  • 删除了 menuAlign 属性，改为使用 align。
  • 删除了 onSelect。请改用父 Dropdown 中的 onSelect。
  • 删除了 alignRight。请改用 align="end"。

表单​

  • 删除了 inline。
  • 删除了 bsPrefix。

FormCheck​

  • 删除了 bsCustomPrefix 和 custom，改为使用 bsSwitchPrefix。
  • 反馈类型现在由 feedbackType 控制，而不是 isValid 和 isInvalid。

FormCheckInput​

  • 删除了 bsCustomPrefix。
  • 删除了 isStatic。

FormCheckLabel​

  • 删除了 bsCustomPrefix。
  • 将基本类从 form-check-input 更改为 form-check-label。

FormControl​

  • 放弃了 as 属性支持 select 标签，改为使用 FormSelect。
  • 删除了 custom。
  • 删除了 bsCustomPrefix。
  • 放弃了 type 支持 range 值，改为使用 FormRange。
  • 添加颜色选择器

FormFile​

  • 放弃了所有与文件相关的组件。改为使用 <Form.Control type="file" />。

FormGroup​

  • 删除了 bsPrefix。.form-group 类不再受 Bootstrap 支持，但此组件对于将 controlId 传递给标签和输入很有用。要处理间距，请改用边距实用程序。

FormRow​

  • 已删除。改为使用 Row。

InputGroup​

  • 放弃了 InputGroupPrepend 和 InputGroupAppend。按钮和 InputGroupText 现在可以作为直接子元素添加。
  • 键盘导航已被删除。如果您需要此功能，请改用 Tabs。
  • 已移除 onSelect。请在父级 Nav 中使用 onSelect。

Popover​

  • 将 content 属性重命名为 body，以与 PopoverContent 组件名称更改保持一致。

PopoverContent​

  • 重命名为 PopoverBody 以匹配类名。

PopoverTitle​

  • 重命名为 PopoverHeader 以匹配类名。

ResponsiveEmbed​

  • 重命名为 Ratio。
  • 纵横比选项已更改为 '1x1' | '4x3' | '16x9' | '21x9'。

SafeAnchor​

  • 重命名为 Anchor。

SplitButton​

  • 删除了 menuAlign 属性，改为使用 align。

Toast​

  • delay 现在默认为 5000 毫秒。

ToggleButton​

  • 添加 bsPrefix。
  • id 现在是必需的。这是为了允许由于 Bootstrap 中的标记更改而切换输入。