mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-05 19:41:42 +08:00
docs(Calendar): fix documentation errors (#13078)
This commit is contained in:
parent
4884cb8efa
commit
8aeeba497e
@ -77,7 +77,7 @@ export default {
|
||||
|
||||
const onConfirm = (dates) => {
|
||||
show.value = false;
|
||||
text.value = `选择了 ${dates.length} 个日期`;
|
||||
text.value = `${dates.length} dates selected`;
|
||||
};
|
||||
|
||||
return {
|
||||
@ -319,7 +319,7 @@ Following props are supported when the type is multiple
|
||||
| Key | Description | Type |
|
||||
| --- | --- | --- |
|
||||
| date | Date | _Date_ |
|
||||
| type | Type, can be set to `selected`、`start`、`middle`、`end`、`disabled` | _string_ |
|
||||
| type | Type, can be set to `selected`、`start`、`middle`、`end`、`disabled`、`start-end`、`multiple-selected`、`multiple-middle`、`placeholder` | _string_ |
|
||||
| text | Text | _string_ |
|
||||
| topInfo | Top info | _string_ |
|
||||
| bottomInfo | Bottom info | _string_ |
|
||||
@ -336,11 +336,11 @@ Following props are supported when the type is multiple
|
||||
| opened | Emitted when Popup is opened | - |
|
||||
| closed | Emitted when Popup is closed | - |
|
||||
| unselect | Emitted when unselect date when type is multiple | _value: Date_ |
|
||||
| month-show | Emitted when a month enters the visible area | _value: { date: Date, title: string }_ |
|
||||
| month-show | Emitted when a month enters the visible area (effective when `switch mode` is `none`) | _value: { date: Date, title: string }_ |
|
||||
| over-range | Emitted when exceeded max range | - |
|
||||
| click-subtitle | Emitted when clicking the subtitle | _event: MouseEvent_ |
|
||||
| click-disabled-date `v4.7.0` | Emitted when clicking disabled date | _value: Date \| Date[]_ |
|
||||
| panel-change | Emitted when switching calendar panel | _{ date: Date }_ |
|
||||
| panel-change | Emitted when switching calendar panel (effective when `switch mode` is not `none`) | _{ date: Date }_ |
|
||||
|
||||
### Slots
|
||||
|
||||
@ -408,7 +408,7 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --van-calendar-header-title-height | _44px_ | - |
|
||||
| --van-calendar-header-title-font-size | _var(--van-font-size-lg)_ | - |
|
||||
| --van-calendar-header-subtitle-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-calendar-header-action-width | 28px | - |
|
||||
| --van-calendar-header-action-width | _28px_ | - |
|
||||
| --van-calendar-header-action-color | _var(--van-text-color)_ | - |
|
||||
| --van-calendar-header-action-disabled-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-calendar-weekdays-height | _30px_ | - |
|
||||
@ -419,16 +419,16 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --van-calendar-day-height | _64px_ | - |
|
||||
| --van-calendar-day-font-size | _var(--van-font-size-lg)_ | - |
|
||||
| --van-calendar-day-margin-bottom | _4px_ | - |
|
||||
| --van-calendar-day-disabled-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-calendar-range-edge-color | _var(--van-white)_ | - |
|
||||
| --van-calendar-range-edge-background | _var(--van-primary-color)_ | - |
|
||||
| --van-calendar-range-middle-color | _var(--van-primary-color)_ | - |
|
||||
| --van-calendar-range-middle-background-opacity | _0.1_ | - |
|
||||
| --van-calendar-selected-day-size | _54px_ | - |
|
||||
| --van-calendar-selected-day-color | _var(--van-white)_ | - |
|
||||
| --van-calendar-selected-day-background | _var(--van-primary-color)_ | - |
|
||||
| --van-calendar-info-font-size | _var(--van-font-size-xs)_ | - |
|
||||
| --van-calendar-info-line-height | _var(--van-line-height-xs)_ | - |
|
||||
| --van-calendar-selected-day-background | _var(--van-primary-color)_ | - |
|
||||
| --van-calendar-day-disabled-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-calendar-confirm-button-height | _36px_ | - |
|
||||
| --van-calendar-confirm-button-margin | _7px 0_ | - |
|
||||
|
||||
|
@ -279,8 +279,8 @@ export default {
|
||||
| show-subtitle | 是否展示日历副标题(年月) | _boolean_ | `true` |
|
||||
| show-confirm | 是否展示确认按钮 | _boolean_ | `true` |
|
||||
| readonly | 是否为只读状态,只读状态下不能选择日期 | _boolean_ | `false` |
|
||||
| confirm-text | 确认按钮的文字 | _string_ | `确定` |
|
||||
| confirm-disabled-text | 确认按钮处于禁用状态时的文字 | _string_ | `确定` |
|
||||
| confirm-text | 确认按钮的文字 | _string_ | `确认` |
|
||||
| confirm-disabled-text | 确认按钮处于禁用状态时的文字 | _string_ | `确认` |
|
||||
| first-day-of-week | 设置周起始日 | _0-6_ | `0` |
|
||||
|
||||
### Calendar Poppable Props
|
||||
@ -325,7 +325,7 @@ export default {
|
||||
| 键名 | 说明 | 类型 |
|
||||
| --- | --- | --- |
|
||||
| date | 日期对应的 Date 对象 | _Date_ |
|
||||
| type | 日期类型,可选值为 `selected`、`start`、`middle`、`end`、`disabled` | _string_ |
|
||||
| type | 日期类型,可选值为 `selected`、`start`、`middle`、`end`、`disabled`、`start-end`、`multiple-selected`、`multiple-middle`、`placeholder` | _string_ |
|
||||
| text | 中间显示的文字 | _string_ |
|
||||
| topInfo | 上方的提示信息 | _string_ |
|
||||
| bottomInfo | 下方的提示信息 | _string_ |
|
||||
@ -342,11 +342,11 @@ export default {
|
||||
| opened | 打开弹出层且动画结束后触发 | - |
|
||||
| closed | 关闭弹出层且动画结束后触发 | - |
|
||||
| unselect | 当日历组件的 `type` 为 `multiple` 时,取消选中日期时触发 | _value: Date_ |
|
||||
| month-show | 当某个月份进入可视区域时触发 | _{ date: Date, title: string }_ |
|
||||
| month-show | 当某个月份进入可视区域时触发(`switch-mode` 为 `none` 时生效) | _{ date: Date, title: string }_ |
|
||||
| over-range | 范围选择超过最多可选天数时触发 | - |
|
||||
| click-subtitle | 点击日历副标题时触发 | _event: MouseEvent_ |
|
||||
| click-disabled-date `v4.7.0` | 点击禁用日期时触发 | _value: Date \| Date[]_ |
|
||||
| panel-change | 日历面板切换时触发 | _{ date: Date }_ |
|
||||
| panel-change | 日历面板切换时触发(`switch-mode` 不为 `none` 时生效) | _{ date: Date }_ |
|
||||
|
||||
### Slots
|
||||
|
||||
@ -414,7 +414,7 @@ calendarRef.value?.reset();
|
||||
| --van-calendar-header-title-height | _44px_ | - |
|
||||
| --van-calendar-header-title-font-size | _var(--van-font-size-lg)_ | - |
|
||||
| --van-calendar-header-subtitle-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-calendar-header-action-width | 28px | - |
|
||||
| --van-calendar-header-action-width | _28px_ | - |
|
||||
| --van-calendar-header-action-color | _var(--van-text-color)_ | - |
|
||||
| --van-calendar-header-action-disabled-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-calendar-weekdays-height | _30px_ | - |
|
||||
@ -425,16 +425,16 @@ calendarRef.value?.reset();
|
||||
| --van-calendar-day-height | _64px_ | - |
|
||||
| --van-calendar-day-font-size | _var(--van-font-size-lg)_ | - |
|
||||
| --van-calendar-day-margin-bottom | _4px_ | - |
|
||||
| --van-calendar-day-disabled-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-calendar-range-edge-color | _var(--van-white)_ | - |
|
||||
| --van-calendar-range-edge-background | _var(--van-primary-color)_ | - |
|
||||
| --van-calendar-range-middle-color | _var(--van-primary-color)_ | - |
|
||||
| --van-calendar-range-middle-background-opacity | _0.1_ | - |
|
||||
| --van-calendar-selected-day-size | _54px_ | - |
|
||||
| --van-calendar-selected-day-color | _var(--van-white)_ | - |
|
||||
| --van-calendar-selected-day-background | _var(--van-primary-color)_ | - |
|
||||
| --van-calendar-info-font-size | _var(--van-font-size-xs)_ | - |
|
||||
| --van-calendar-info-line-height | _var(--van-line-height-xs)_ | - |
|
||||
| --van-calendar-selected-day-background | _var(--van-primary-color)_ | - |
|
||||
| --van-calendar-day-disabled-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-calendar-confirm-button-height | _36px_ | - |
|
||||
| --van-calendar-confirm-button-margin | _7px 0_ | - |
|
||||
|
||||
|
@ -17,16 +17,16 @@
|
||||
--van-calendar-day-height: 64px;
|
||||
--van-calendar-day-font-size: var(--van-font-size-lg);
|
||||
--van-calendar-day-margin-bottom: 4px;
|
||||
--van-calendar-day-disabled-color: var(--van-text-color-3);
|
||||
--van-calendar-range-edge-color: var(--van-white);
|
||||
--van-calendar-range-edge-background: var(--van-primary-color);
|
||||
--van-calendar-range-middle-color: var(--van-primary-color);
|
||||
--van-calendar-range-middle-background-opacity: 0.1;
|
||||
--van-calendar-selected-day-size: 54px;
|
||||
--van-calendar-selected-day-color: var(--van-white);
|
||||
--van-calendar-selected-day-background: var(--van-primary-color);
|
||||
--van-calendar-info-font-size: var(--van-font-size-xs);
|
||||
--van-calendar-info-line-height: var(--van-line-height-xs);
|
||||
--van-calendar-selected-day-background: var(--van-primary-color);
|
||||
--van-calendar-day-disabled-color: var(--van-text-color-3);
|
||||
--van-calendar-confirm-button-height: 36px;
|
||||
--van-calendar-confirm-button-margin: 7px 0;
|
||||
}
|
||||
|
@ -69,16 +69,16 @@ export type CalendarThemeVars = {
|
||||
calendarDayHeight?: string;
|
||||
calendarDayFontSize?: string;
|
||||
calendarDayMarginBottom?: string;
|
||||
calendarDayDisabledColor?: string;
|
||||
calendarRangeEdgeColor?: string;
|
||||
calendarRangeEdgeBackground?: string;
|
||||
calendarRangeMiddleColor?: string;
|
||||
calendarRangeMiddleBackgroundOpacity?: number | string;
|
||||
calendarSelectedDaySize?: string;
|
||||
calendarSelectedDayColor?: string;
|
||||
calendarSelectedDayBackground?: string;
|
||||
calendarInfoFontSize?: string;
|
||||
calendarInfoLineHeight?: number | string;
|
||||
calendarSelectedDayBackground?: string;
|
||||
calendarDayDisabledColor?: string;
|
||||
calendarConfirmButtonHeight?: string;
|
||||
calendarConfirmButtonMargin?: string;
|
||||
};
|
||||
|
Loading…
x
Reference in New Issue
Block a user