Bootstrap 并作出反应-bootstrap

Question

我正在学习 react.js，我需要让我的应用响应。我应该使用什么？ Bootstrap 或反应-bootstrap？我可以在反应中使用 Bootstrap 吗？或者我需要使用 react-bootstrap？有什么区别

Answer 1

react-bootstrap is a UI library of components similar to material-ui 或许多其他 UI 库，而 Bootstrap 本身就是 CSS 类 + HTML UI 个组件。

你可以自由选择，反应-bootstrap或Bootstrap由你选择。

您可以阅读更多关于它们的信息here

Answer 2

Bootstrap:

import * as React from 'react';

function Example()  {
  return (
    <div class="alert alert-danger alert-dismissible fade show" role="alert">
      <strong>Oh snap! You got an error!</strong> 
      <p> 
        Change this and that and try again.
      </p>
      <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </button>
    </div>
  )
}

React-Bootstrap:

import * as React from 'react';
import Alert from 'react-bootstrap/Alert';
function Example() {
  return (
    <Alert dismissible variant="danger">
      <Alert.Heading>Oh snap! You got an error!</Alert.Heading>
      <p>
        Change this and that and try again.
      </p>
    </Alert>
  )
}