javascript - 为什么我的 react-bootstrap ListGroup 显示不同？

Question

我正在使用 react-bootstrap 组成一个列表组，下面是我的渲染代码

render() {
        return (
            <ListGroup>
                <ListGroupItem header="paitent1" href='#' active>
                    session 1
                </ListGroupItem>
                <ListGroupItem header="paitent2" href='#'>
                    session 2
                </ListGroupItem>
            </ListGroup>
        );
    }

它很简单，但显示起来很丑，我的 react-bootstrap 是 0.32.1。怎么了？

Answer 1

您可能已经在组件中导入了库，但您仍然需要自己导入 css。

https://react-bootstrap.github.io/getting-started/introduction

您可以将其导入您的 index.html https://react-bootstrap.github.io/getting-started/introduction

或者你可以将它导入到你的 src/index.js 中，让 webpack 处理你的 CSS