React Bootstrap下拉组件未接收任何样式
React Bootstrap下拉组件未接收任何样式
提问于 2020-08-19 21:41:54
我已经安装了带有yarn yarn add react-bootstrap bootstrap的react-bootstrap。
我正在使用dropdown组件，但当我显示它时，它并不像预期的那样显示：
这就是我需要的
这是我的代码
import React from "react";
import { Dropdown } from "react-bootstrap";
// import PropTypes from "prop-types";
import "../Dropdown/index.css";
const DropdownItem = () => {
return (
<Dropdown>
<Dropdown.Toggle variant="success" id="dropdown-basic">
Dropdown Button
</Dropdown.Toggle>
<Dropdown.Menu>
<Dropdown.Item href="#/action-1">Action</Dropdown.Item>
<Dropdown.Item href="#/action-2">Another action</Dropdown.Item>
<Dropdown.Item href="#/action-3">Something else</Dropdown.Item>
</Dropdown.Menu>
</Dropdown>
);
}
export default DropdownItem;我不知道为什么下拉菜单没有样式。
回答 1
Stack Overflow用户
发布于 2020-08-19 22:03:26
这是因为您可能没有在index.html文件中导入CSS。
您需要在项目的public/index.html文件中添加类似以下内容
<link
rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk"
crossorigin="anonymous"
/>或
您可以在App.js或index.js文件中导入CSS，如下所示
import 'bootstrap/dist/css/bootstrap.min.css';您可以在react-bootstrap docs中查看有关它的更多信息
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/63488315
复制相关文章
相似问题
腾讯云开发者
