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

Posted 2023-03-21

【中文标题】twitter bootstrap 无法通过反应按预期工作

【英文标题】：twitter bootstrap not working as expected with react

【发布时间】：2021-06-01 20:12:39

【问题描述】：

我正在尝试将 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

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

【参考方案1】：

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

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