twitter bootstrap 无法通过反应按预期工作

Question

我正在尝试将 twitter 引导程序与 react 一起使用。 我有以下代码：

import { Container, Row, Col} from 'react-bootstrap';

const SignUpComponent = ({ history }: { [key: string]: any }) => (
  <>
    <Container fluid>
      
      <Row>
       <Col lg={4} md={4}>xxx</Col>
       <Col lg={4} md={4}>yyy</Col>
       <Col lg={4} md={4}>zzz</Col>

      </Row>
    </Container>
  </>
 
);

我原以为它会出现在屏幕上的 3 列中，但我看到了以下输出。

xxx
yyy
zzz

而不是

xxx yyy zzz

我无法调试为什么会发生这种情况。谁能帮忙解释一下为什么会这样？

Answer 1

index.tsx 文件需要有以下导入

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