时间戳

首页 > 解决方案 > 'Collapse' 未定义 react/jsx-no-undef

reactjs - 'Collapse' 未定义 react/jsx-no-undef

问题描述

我是 React 的新手，现在我正在尝试做侧边栏并隐藏显示折叠菜单项。

这是功能=>

 collapsemetoggle(){
        this.setState(state => ({ collapsemeopen: !state.collapsemeopen }));
      }


 <div className="list-group list-group-flush">
          <a href="#" className="list-group-item list-group-item-action bg-light">Dashboard</a>              
          <a onClick={this.collapsemetoggle} data-toggle="collapse" className="list-group-item list-group-item-action bg-light">Collapase Me</a>

          <Collapse isOpen={this.state.collapsemeopen}>
            <div className="list-group list-group-flush">
              <a href="#" className="list-group-item list-group-item-action bg-light">Dashboard</a>                  
            </div>
          </Collapse>
        </div>

      </div>

但为什么

'Collapse' 未定义 react/jsx-no-undef

显示？我只是从这里参考=>

反应过渡

我正在努力实现获得像 => 这样的侧边栏

侧边栏

其他人ul li用于菜单列表，我正在尝试使用collapse. 这是正确的方法吗？如果没有，请让我知道一些例子。

标签： reactjssidebarcollapsereact-bootstrap

解决方案

导入折叠：

import {Collapse} from 'react-bootstrap'

使用 props in 代替 isOpen

 <Collapse in={this.state.open}>
      <div id="example-collapse-text">
        Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus
        terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer
        labore wes anderson cred nesciunt sapiente ea proident.
      </div>
    </Collapse>

推荐阅读