我的代码中是否有任何错误，因为我的collapse组件无法工作？

Question

我正在创建一个reactjs web-app，我想在其中使用collapse功能，所以我安装了reactstrap依赖性，并从那里导入 "collapse "组件。所以我安装了reactstrap依赖性，并从那里导入了 "collapse "组件。但是它在我的代码中没有工作。

import { Component } from "react";
import React from "react";
import { Collapse, Navbar } from "reactstrap";
class Main extends Component {
  constructor(props) {
  super(props);
  this.state = {
  open: false
  };
}
 show() {
 this.setState({
  open: !this.state.open
  });
 }
 render() {
    return (
  <>
    <button onClick={() => this.show()}>Show</button>
    <Collapse isOpen={this.state.open}>
      <Navbar>hello</Navbar>
    </Collapse>
  </>
 );
}
}
export default Main;

查看一下 演示在这里，我想说的是，我在创建一个reactjs web-app，我想在其中使用折叠功能。

Answer 1

添加 import 'bootstrap/dist/css/bootstrap.min.css'; 在你的index.js文件中。