使用ant design pro有感

目录

1.引言

2.收获

3.代码示例

3.1日期选择框

效果图：

3.2带滑轮的列表

效果图：

 3.3行列分布

 3.4选择框

效果图：

---

1.引言

上一周我一直在学习怎么使用ant design里面的组件。不得不说，ant design pro实在是太适合开发者了，各种组件都有，就是组件的代码“有点坑”。

2.收获

很多情况下我已经知道了自己要什么组件。比如顶部固定的导航，日期选择框，抽屉等等，但是官方给的代码并不是给开发者直接用的，要改一改，不能ctrl+c/ctrl+v实在让人觉得苦恼，所以我把我解决的部分问题总结了一下。

3.代码示例

3.1日期选择框

/*一共四部分*/

import {DatePicker} from 'antd';    /p1

const {RangePicker} = DatePicker;    /p2

onRangePickerChange(dates: any, dateStrings: any)           /p3
{
    console.log('From: ', dates[0], ', to: ', dates[1]);
    console.log('From: ', dateStrings[0], ', to: ', dateStrings[1]);
}

<RangePicker placeholder={['开始日期', '结束日期']} onChange={this.onRangeP