Как добавить Bootstrap в приложение React и использовать классы внутри

Question

Может кто-нибудь объяснить, как добавить bootstrap для реагирования приложения и как их использовать в компонентах реагирования, поскольку мы не можем добавлять ссылки CDN и атрибут "class" в приложении реагирования. Не могли бы вы объяснить, как использовать bootstrap компоненты внутри приложения реакции. Это будет очень полезно для меня, так как я очень начинающий, чтобы реагировать разработчик ..

Answer 1

Читать это https://react-bootstrap.github.io/getting-started/introduction

     1. install react-bootstrap

                npm install react-bootstrap bootstrap


     2. import css file in your index.js or app.js

                import 'bootstrap/dist/css/bootstrap.min.css';

             <link
              rel="stylesheet"
              href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
              integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
              crossorigin="anonymous"
             />

      3. import components like

                import { Button } from 'react-bootstrap';

Вы можете использовать обычные bootstrap классы, такие как className="row"

Answer 2

Вы не можете использовать bootstrap непосредственно в приложении реакции, вместо этого вы можете использовать реагирующий ремень , который содержит bootstrap компоненты.

Пример использования реактивного ремня внутри реакции

import React from 'react';
import { Button } from 'reactstrap';

export default (props) => {
  return (
    <Button color="danger">Danger!</Button>
  );
};