Skip to main content

Property API

tip

Standardized components unify implementations across PC, H5, and mini-program platforms while exposing a series of standard APIs to the public, including style APIs and custom CSS variables. All standardized components are marked with in the Component List.

Standardized components expose a property API (Widget API) that retrieves the internal state and property values of components. The internal values can be accessed via $w.componentId.propertyName. For example, $w.input1.value retrieves the user input value of the single-line input component with the id input1 on the page.

Component Property API List

To learn which property APIs are exposed by components, please refer to the Property API section in the component documentation.

Difference Between Property API and Properties

Properties are values passed in externally to components and can be configured in the component's settings panel. Properties control the behavior and appearance of components, such as the value of an input box or the text of a button.

Property API is a programming interface that allows retrieving property values and state values through code. In code, you can use the $w object to access components on the page and use $w.componentId.propertyName to get Property API values. For example, you can use $w.input1.value to get the value of an input box.

Note that Property APIs are read-only and cannot be directly modified. When modification is needed, you can either call methods exposed by the component or modify the variables bound to the component properties.

The main difference between properties and Property APIs lies in their usage and scope. Properties are configured in the component's settings panel and can only be used within the component. Property APIs, however, are used in code and can be accessed both outside and inside the component. Property APIs enable developers to more flexibly control component behavior and appearance, allowing for more complex functionality implementation.