antd遇到的问题汇总

遇到问题看文档一般都可以得到解决。

table添加滚动条以后表格对不齐

官方文档给出的解释：

若列头与内容不对齐或出现列重复，请指定固定列的宽度 width。如果指定 width 不生效或出现白色垂直空隙，请尝试建议留一列不设宽度以适应弹性布局，或者检查是否有超长连续字段破坏布局。
建议指定 scroll.x 为大于表格宽度的固定值或百分比。注意，且非固定列宽度之和不要超过 scroll.x。
注意：v4 版本固定列通过 sticky 实现，IE 11 会降级成横向滚动。

但是可能还会出现上下对不齐的时候，是因为表格里有的数据太长导致的，给它指定宽度盛下它即可。

下拉框Select跟随页面滚动或者日期选择框DatePicker跟随页面滚动

官方文档给出的都是使用getPopupContainer 指定容器，然后给容器设置定位即可，但是getPopupContainer 对于日期选择框无效，日期选择框应使用getCalendarContainer。可能版本升级后会统一。

Nav导航在刷新页面或者点击浏览器后退时高亮问题

使用withRouter即可解决。

import React from 'react'
import {Layout, Menu} from 'antd'
import {withRouter} from 'react-router-dom';
const {Sider} = Layout

export default class Nav extends React.Component {
  constructor(props) {
    super(props)
    this.state = {}
  }

  go = (e) => {
    this.props.history.push(`${e.key}`)
  }

  render() {
    const {collapsed} = this.props;

    const LeftSider = withRouter(({history}) => {
      return (
        <Menu theme="dark" mode="inline"
              selectedKeys={[history.location.pathname]}
              onClick={this.go}
              className={css.nav}>
          <Menu.Item key="/">
            <Ico type="shouye"/>
            <span>首页</span>
          </Menu.Item>

          <Menu.Item key="/orderManage">
            <Ico type="baobiao"/>
            <span>订单管理</span>
          </Menu.Item>
          <Menu.Item key="/billManage">
            <Ico type="baobiao"/>
            <span>账单管理</span>
          </Menu.Item>
        </Menu>

      );
    })

    return (
      <Sider id="app-aside" trigger={null} collapsible collapsed={collapsed} theme="light">
      	<LeftSider/>
      </Sider>
    )
  }
}