未验证 提交 6a061047 编写于 作者: S SkyAo 提交者: GitHub

docs: fix heading level in replace-moment (#26725)

上级 ab3d0ea8
......@@ -5,13 +5,13 @@ title: Replace Moment.js
You might want to replace Moment.js with another date library (now support [dayjs](https://day.js.org) and [date-fns](https://date-fns.org)) to reduce bundle size. We provide two ways to customize:
### Custom component
## Custom component
The first way is use `generatePicker` (or `generateCalendar`) helps to create Picker components.
First, we initialize an antd demo with `create-react-app`. You can refer to [Use in TypeScript](/docs/react/use-in-typescript), or you can start directly here [init antd](https://github.com/xiaohuoni/antd4-generate-picker/commit/47fec964e36d48bd15760f8f5abcb9655c259aa6)
#### DatePicker.tsx
### DatePicker.tsx
Create `src/components/DatePicker.tsx`.
......@@ -28,7 +28,7 @@ const DatePicker = generatePicker<Dayjs>(dayjsGenerateConfig);
export default DatePicker;
```
#### TimePicker.tsx
### TimePicker.tsx
Create `src/components/TimePicker.tsx`.
......@@ -52,7 +52,7 @@ TimePicker.displayName = 'TimePicker';
export default TimePicker;
```
#### Calendar.tsx
### Calendar.tsx
Create `src/components/Calendar.tsx`.
......@@ -69,7 +69,7 @@ const Calendar = generateCalendar<Dayjs>(dayjsGenerateConfig);
export default Calendar;
```
#### Export Custom component
### Export Custom component
Create `src/components/index.tsx`.
......@@ -81,7 +81,7 @@ export { default as Calendar } from './Calendar';
export { default as TimePicker } from './TimePicker';
```
#### Use Custom component
### Use Custom component
Modify `src/App.tsx`,import `dayjs` and custom component.
......@@ -99,7 +99,7 @@ If you need JavaScript code, you can refer to [antd4-generate-picker/antd-demo](
If you use [umi](https://umijs.org/), you can reference [antd4-use-dayjs-replace-moment](https://github.com/xiaohuoni/antd4-use-dayjs-replace-moment).
### antd-dayjs-webpack-plugin
## antd-dayjs-webpack-plugin
We also provide another implementation, which we provide with `antd-dayjs-webpack-plugin`, replacing `momentjs` with `Day.js` directly without changing a line of existing code. More info can be found at [antd-dayjs-webpack-plugin](https://github.com/ant-design/antd-dayjs-webpack-plugin).
......
......@@ -5,13 +5,13 @@ title: 替换 Moment.js
你可以用自定义日期库([day.js](https://day.js.org)[date-fns](https://date-fns.org))替换 Moment 以优化打包大小。在这里我们提供了两种方式来实现替换:
### 自定义组件
## 自定义组件
第一种方法是使用 `generatePicker`(或 `generateCalendar`)辅助创建 Picker 组件。
我们先初始化一个 `create-react-app` 的 antd demo,你可以参考 [在 TypeScript 中使用](/docs/react/use-in-typescript) 进行构建,也可以直接从这里开始[init antd](https://github.com/xiaohuoni/antd4-generate-picker/commit/47fec964e36d48bd15760f8f5abcb9655c259aa6)
#### DatePicker.tsx
### DatePicker.tsx
新建 `src/components/DatePicker.tsx`
......@@ -28,7 +28,7 @@ const DatePicker = generatePicker<Dayjs>(dayjsGenerateConfig);
export default DatePicker;
```
#### TimePicker.tsx
### TimePicker.tsx
新建 `src/components/TimePicker.tsx`
......@@ -52,7 +52,7 @@ TimePicker.displayName = 'TimePicker';
export default TimePicker;
```
#### Calendar.tsx
### Calendar.tsx
新建 `src/components/Calendar.tsx`
......@@ -81,7 +81,7 @@ export { default as Calendar } from './Calendar';
export { default as TimePicker } from './TimePicker';
```
#### 使用自定义组件
### 使用自定义组件
修改 `src/App.tsx`,引入 `dayjs` 和自定义的组件。
......@@ -99,7 +99,7 @@ export { default as TimePicker } from './TimePicker';
如果你熟悉 [umi](https://umijs.org/),你可以参考 [antd4-use-dayjs-replace-moment](https://github.com/xiaohuoni/antd4-use-dayjs-replace-moment)
### antd-dayjs-webpack-plugin
## antd-dayjs-webpack-plugin
我们还提供另一种实现方式。使用 `antd-dayjs-webpack-plugin` 插件,无需对现有代码做任何修改直接替换成 `Day.js`。请参考 [antd-dayjs-webpack-plugin](https://github.com/ant-design/antd-dayjs-webpack-plugin)
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册