mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-16 01:29:11 +08:00
56fb6178a4
* demo: update demo * fix: fix snap * update demo
34 lines
994 B
TypeScript
34 lines
994 B
TypeScript
import React from 'react';
|
|
import { DatePicker, Space, theme } from 'antd';
|
|
import type { Dayjs } from 'dayjs';
|
|
import type { CellRenderInfo } from 'rc-picker/es/interface';
|
|
|
|
const App: React.FC = () => {
|
|
const { token } = theme.useToken();
|
|
const style: React.CSSProperties = {
|
|
border: `1px solid ${token.colorPrimary}`,
|
|
borderRadius: '50%',
|
|
};
|
|
const cellRender = React.useCallback((current: number | Dayjs, info: CellRenderInfo<Dayjs>) => {
|
|
if (info.type !== 'date') {
|
|
return info.originNode;
|
|
}
|
|
if (typeof current === 'number') {
|
|
return <div className="ant-picker-cell-inner">{current}</div>;
|
|
}
|
|
return (
|
|
<div className="ant-picker-cell-inner" style={current.date() === 1 ? style : {}}>
|
|
{current.date()}
|
|
</div>
|
|
);
|
|
}, []);
|
|
return (
|
|
<Space size={12} direction="vertical">
|
|
<DatePicker cellRender={cellRender} />
|
|
<DatePicker.RangePicker cellRender={cellRender} />
|
|
</Space>
|
|
);
|
|
};
|
|
|
|
export default App;
|