diff --git a/website/docs/en-US/calendar.md b/website/docs/en-US/calendar.md index 5c8f9b6fb5..f95b441705 100644 --- a/website/docs/en-US/calendar.md +++ b/website/docs/en-US/calendar.md @@ -72,6 +72,46 @@ Display date. ::: +### Custom head + +:::demo by setting the name `header` of `scoped-slot` Customize the content displayed in the calendar header. exist `scoped-slot` You can get date (the date of the current cell). For details, please refer to the API documentation below. + +```html + + + + + +``` + +::: + ### Localization The default locale of is English, if you need to use other languages, please check [Internationalization](#/en-US/component/i18n) @@ -90,3 +130,9 @@ Note, date time locale (month name, first day of the week ...) are also configed | Attribute | Description | Type | Accepted Values | Default | | --------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------ | --------------- | ------- | | data | { type, isSelected, day, date }. `type` indicates which month the date belongs, optional values are prev-month, current-month, next-month; `isSelected` indicates whether the date is selected; `day` is the formatted date in the format YYYY-MM-DD; `date` is date the cell represents | Object | — | — | + +### Methods + +| Event Name | Description | Attribute | +| ---------- | ----------- | ------------------------------------------------------- | +| selectDate | Switch date | today / prev-month / next-month / prev-year / next-year | diff --git a/website/docs/es/calendar.md b/website/docs/es/calendar.md index 4649721ae8..158c3169ce 100644 --- a/website/docs/es/calendar.md +++ b/website/docs/es/calendar.md @@ -72,6 +72,46 @@ Muestra fechas. ::: +### Cabeza personalizada + +:::demostración configurando el nombre `header` de `scoped-slot` Personaliza el contenido que se muestra en el encabezado del calendario. existe `scoped-slot` Puede obtener la fecha (la fecha de la celda actual). Para obtener más información, consulte la documentación de la API a continuación. + +```html + + + + + +``` + +::: + ### Localization The default locale of is English, if you need to use other languages, please check [Internationalization](#/es/component/i18n) @@ -90,3 +130,9 @@ Note, date time locale (month name, first day of the week ...) are also configed | Atributo | Descripción | Tipo | Valores aceptados | Por defecto | | -------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------ | ----------------- | ----------- | | data | { type, isSelected, day, date}. `type` indica el mes al que pertenece la fecha, los valores opcionales son mes anterior, mes actual, mes siguiente; `isSelected` indica si la fecha está seleccionada; `day` es la fecha formateada en el formato yyyy-MM-dd; `date` es la fecha que la celda representa | Object | — | — | + +### Methods + +| Event Name | Description | Attribute | +| ---------- | ------------- | ------------------------------------------------------- | +| selectDate | Cambiar fecha | today / prev-month / next-month / prev-year / next-year | diff --git a/website/docs/fr-FR/calendar.md b/website/docs/fr-FR/calendar.md index cae979a26b..6f56800824 100644 --- a/website/docs/fr-FR/calendar.md +++ b/website/docs/fr-FR/calendar.md @@ -72,6 +72,48 @@ Affiche un calendrier. ::: +### Tête personnalisée + +:::demo Intervalle en définissant le nom `header` de `scoped-slot` Personnalisez le contenu affiché dans l'en-tête du calendrier. exister `scoped-slot` Vous pouvez obtenir la date (la date de la cellule actuelle). Pour plus de détails, veuillez vous référer à la documentation de l'API ci-dessous. + +```html + + + + + +``` + +::: + ### Localization The default locale of is English, if you need to use other languages, please check [Internationalization](#/fr-FR/component/i18n) @@ -90,3 +132,9 @@ Note, date time locale (month name, first day of the week ...) are also configed | Attribut | Description | Type | Valeurs acceptées | Défaut | | -------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------ | ----------------- | ------ | | data | { type, isSelected, day, date }. `type` indique le mois de la date courante, les valeurs prev-month, current-month et next-month pouvant être utilisées; `isSelected` indique si la date est sélectionnée; `day` est la date formattée en YYYY-MM-DD; `date` est la date de la cellule courante. | Object | — | — | + +### Methods + +| Event Name | Description | Attribute | +| ---------- | --------------- | ------------------------------------------------------- | +| selectDate | Changer de date | today / prev-month / next-month / prev-year / next-year | diff --git a/website/docs/jp/calendar.md b/website/docs/jp/calendar.md index 785bd9eddb..cb10d4cc26 100644 --- a/website/docs/jp/calendar.md +++ b/website/docs/jp/calendar.md @@ -71,6 +71,38 @@ ::: +### カスタムヘッド + +:::demo という名前を設定することで `header` に `scoped-slot` カレンダーヘッダーに表示されるコンテンツをカスタマイズします。 存在 `scoped-slot` 日付（現在のセルの日付）を取得できます。 詳細については、以下の API ドキュメントを参照してください。 + +```html + + + + + +``` + +::: + ### Localization The default locale of is English, if you need to use other languages, please check [Internationalization](#/jp/component/i18n) @@ -90,3 +122,9 @@ Note, date time locale (month name, first day of the week ...) are also configed | Attribute | Description | Type | Accepted Values | Default | | --------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------ | --------------- | ------- | | data | { type, isSelected, day, date }. `type` は日付が属する月を示し、オプションの値は前月、現在の月、次の月です。`isSelected` は日付が選択されているかどうかを示す。`day`は yyyy-MM-dd 形式でフォーマットされた日付です。`date` はセルが表す日付 | Object | — | — | + +### メソッド + +| Event Name | Description | Attribute | +| ---------- | -------------- | ------------------------------------------------------- | +| selectDate | 日付の切り替え | today / prev-month / next-month / prev-year / next-year | diff --git a/website/docs/zh-CN/calendar.md b/website/docs/zh-CN/calendar.md index 73b3bde515..44203e377e 100644 --- a/website/docs/zh-CN/calendar.md +++ b/website/docs/zh-CN/calendar.md @@ -72,6 +72,42 @@ ::: +### 自定义头部 + +:::demo 通过设置名为 `header` 的 `scoped-slot` 来自定义日历头部显示的内容。在 `scoped-slot` 可以获取到 date（当前单元格的日期）。详情解释参考下方的 API 文档。 + +```html + + + + + +``` + +::: + ### 国际化 默认语言是英语 (English), 如需使用其他语言, 请参考 [国际化](#/zh-CN/component/i18n) @@ -90,3 +126,9 @@ | 参数 | 说明 | 类型 | 可选值 | 默认值 | | ---- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------ | ------ | ------ | | data | { type, isSelected, day, date }，`type` 表示该日期的所属月份，可选值有 prev-month，current-month，next-month；`isSelected` 标明该日期是否被选中；`day` 是格式化的日期，格式为 yyyy-MM-dd；`date` 是单元格的日期 | Object | — | — | + +### Methods + +| 方法名 | 说明 | 参数 | +| ---------- | -------- | ------------------------------------------------------- | +| selectDate | 切换日期 | today / prev-month / next-month / prev-year / next-year |