Skip to main content

Calendar

WdCalendar

Applicable Scenarios

For flat display of calendar data, such as attendance data display and schedule display.

Basic Capabilities Description

In the display configuration properties, multiple dates can be added to gray out or mark with dots the corresponding dates.

Example

Interactive Preview

Properties

External properties received by the component

Property Name
Property Identifier
Type
Description
展示年月initMonthnumber
选中日期valuenumber
最早可选日期start
最晚可选日期end
展示配置configDataarray

可设置多个不同日期的特殊显示效果

Default value: []

时间控制器initVisibleboolean

显示切换年月的操作按钮

Default value: true

Events

Events exposed by the component. You can listen to component events to trigger external actions

Event Name
Event Code
Event Output Parameters event.detail
Applicable Scenarios
Description
选中日期changeobject
  • value: number

    日期

Compatible with all platforms

-

年月切换changeMonthobject
  • value: number

    年月

Compatible with all platforms

-

Property API

Through the Property API, you can access the internal state and property values of components. You can access internal values using$w.componentId.propertyName, such as $w.input1.value. For details, please refer to Property API

Read-only Property Name
Property Identifier
Type
Description
展示年月initMonthnumber
选中日期valuenumber
展示配置configDataarray

可设置多个不同日期的特殊显示效果

时间控制器initVisibleboolean

显示切换年月的操作按钮

Method API

Through the Method API, you can programmatically trigger internal methods of components, such as submitting forms, displaying popups, etc. You can call component methods using $w.componentId.methodName, such as $w.form1.submit()

Method Name
Method Identifier
Parameters
Method Description
设置选中日期setValuenumber日期

通过 $w.id1.setValue(1688140800000) 设置选中日期

切换年月setInitMonthnumber年月

通过 $w.id1.setInitMonth(1688140800000) 切换年月