twitter-bootstrap - react Bootstrap 中的 Bootstrap "type alignment"

Question

我正在将使用 Bootstrap 构建的 Web 应用程序迁移到 React 和 react-bootstrap，两者都很棒。我在 react-bootstrap 中没有看到的一件事是如何顺利集成 Bootstrap 的 type alignment classes例如text-center .我的应用程序包装在

<div class="container-fluid text-center">

我看到了两种解决方法，但我想知道是否有推荐的解决方法不是这样的 hack。

一个。替换我的 <Grid>带有 <Grid bsClass="text-center container"> 的 JSX 标签.这似乎工作正常，但我在 react-bootstrap docs 中看到“一般来说，人们应该只改变 bsClass 来为组件提供新的、非 Bootstrap 的 CSS 样式。”我什至可以添加 fluid支持 Grid它改变了container至 container-fluid没有破损。

将所有内容包装在 <div className="text-center"> 中.我喜欢的一件事 react-bootstrap是没有大量额外的干净代码 <div> s，所以这是不雅的。

正如我所说，只是想知道是否有现成的方法可以做到这一点。很高兴在 react-bootstrap 中对此发表一些评论文档，因为它是 Bootstrap docs 的一部分似乎根本没有提到。

谢谢!

Answer 1

我会用 <Grid className="text-center" > 手动添加类，特别是考虑到您提到这是包装您的应用程序的单个元素，而不是将在不同情况下重复使用的元素。