All Products
Search
Document Center

Component overview

Last Updated: Feb 22, 2021

Basic components

The Mini Program framework provides developers with a set of basic components. Developers can combine these basic components for service development.

Common component attributes

All components have the following attributes:

Property Type Description Remarks
id String The unique identifier of the component. -
class String Style-related attributes -
style String The inline style -
data-* Any Custom attributes When an event is triggered, custom attributes are passed to the event handler.
on* / catch* EventHandle Bind the event, which follows the camel case naming convention, such as onTap. For details, see Events.

Component attribute types

Each component provides a set of attribute configurations, and each attribute value has type requirements:

Type Description Remarks
Boolean Boolean -
Number Numeric -
String String -
Array Array -
Object Object -
EventHandle The event handler Define the implementation for the event handler name in Page.
any Any type is allowed. -

Component data binding

You must pass in the specified attribute type data through {{}}. For details, see Bind Data.

Basic component overview

The view container

Name Function
view The view container.
swiper The slider view container.
scroll-view The scrollable view area.
cover-view The text view overlaid on native components.
movable-view The movable view container.
movable-area The movable area of <movable-view>.

Basic content

Name Function
text The text of the word.
icon The icon.
progress The progress bar.
rich-text The rich-text component.

Form component

Name Function
button The button.
form The form.
label It is used to improve the usability of form components.
input The entry box
textarea The multi-line entry box.
radio The single-choice item.
checkbox The multi-choice selector group.
switch The single-choice item.
slider The slide selector.
picker-view The scroll selector embedded in the page.
picker The scroll selector that pops up from the bottom.

Navigation

Name Description
navigator Page links

Media component

Name Description
image The image component.
video The video component.

Canvas

Name Function
canvas The canvas.

Map

Name Function
map The map component.

Open components

Name Function
web-view The component that hosts HTML5 webpages.