The Mini Program framework provides developers with a set of basic components. Developers can combine these basic components for service development.
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 | 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 |
|
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. |