时间戳

首页 > 解决方案 > react/antd中的抽屉在右侧没有打开，就在所有组件的下方

reactjs - react/antd中的抽屉在右侧没有打开，就在所有组件的下方

问题描述

我希望当按下我的搜索按钮时，在右侧打开一个菜单，但它不服从，它在桌子下方打开

<div className='container-fluid'>
  <Drawer
    title="Teste"
    closable={true}
    onClose={this.onClose}
    visible={this.state.displayDiv}
  >
    <p>Some contents...</p>
    <p>Some contents...</p>
    <p>Some contents...</p>
  </Drawer>
  <div className='row' style={{ marginLeft: 30 }}>
    <button class='btn btn-outline-success' type='button' onClick={this.changeDiv} style={{ marginLeft: 20, height: 40 }}>
      Pesquisar
    </button>
  </div>

  <table>
    {...}
  </table>
</div>

我使用引导程序作为样式和 antd 作为组件

标签： reactjsbootstrap-4antddrawer

解决方案

有同样的问题。在调查时我发现我没有将我的 antd css 导入到我的 index.css 文件中。

这是我的 index.css 文件：

@import '~antd/dist/antd.css';


body {
  margin: 0;
  font-family: 'Arimo', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
    monospace;
}

推荐阅读