使用ant-design table遇到的坑

以下为开发过程中遇到的ant-desigin table的坑，如有异议请留言，多谢。

不定时更新...

1. 表格列设置了宽度不生效(v5版本)

需求：设定每一列的宽度，整个列表随每一列的列宽撑开

问题：设置了宽度不生效

代码：

import React from 'react';
import { Table } from 'antd';
const columns = [
  {
    title: 'Name',
    dataIndex: 'name',
    key: 'name',
    render: (text) => <a>{text}</a>,
    with: 100,
  },
  {
    title: 'Age',
    dataIndex: 'age',
    key: 'age',
    with: 100,
  },
  {
    title: 'Address',
    dataIndex: 'address',
    key: 'address',
    with: 100,
  },
];
const data = [
  {
    key: '1',
    name: 'John Brown',
    age: 32,
  },
  {
    key: '2',
    name: 'Jim Green',
    age: 42,
  },
  {
    key: '3',
    name: 'Joe Black',
    age: 32,
  },
];
const AntdTable = () => <Table columns={columns} dataSource={data} />;
export default AntdTable;

效果图：

解决：给table添加样式display: flex

代码(就加了个style，其他同上)：

const AntdTable = 
    () => (
        <Table
            columns={columns}
            dataSource={data}
            style={{display: 'flex'}} // 关键代码
        />;
    )

2. 可编辑单元格若为textarea，聚焦后会跳一下😵（v4版本，具体版本？？？用新版本的先忽略此条吧）

场景：可编辑表格

问题：单元格元素为Input.Textarea，内容为空的前提下，鼠标点击聚焦后，表格高度会跳一下

效果图：

内网项目中遇到的，用的组件也是基于antd4.?的组件，不能截图😞

回头遇到再补

代码：和antd官网 table 可编辑单元格代码一样，只是把Input换成了Input.Textarea，替换代码如下：

        // <Input autoSize ref={inputRef} onPressEnter={save} onBlur={save} />
        // 上条代码换成下边
        <Input.TextArea autoSize={{minRows: 1}} ref={inputRef} onBlur={save} />

解决：autoSize和row两个属性一起使用，代码如下

    <Input.TextArea row={1} autoSize={{minRows: 1}} ref={inputRef} onBlur={save} />