溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
微信小程序為小程序開發者提供了一系列小程序基礎組件，開發者可以通過組合這些小程序基礎組件進行微信小程序的快速開發。
微信小程序組件是什么？微信小程序組件怎么用？
小程序組件是視圖層的基本組成單元。
小程序組件自帶一些功能與微信風格的樣式。
一個小程序組件通常包括開始標簽和結束標簽，屬性用來修飾這個組件，內容在兩個標簽之內。
<tagname property="value"> Content goes here ... </tagename>
注意：所有小程序組件與屬性都是小寫，以連字符-連接
| 類型 | 描述 | 注解 |
|---|---|---|
| Boolean | 布爾值 | 組件寫上該屬性，不管該屬性等于什么，其值都為true，只有組件上沒有寫該屬性時，屬性值才為false。如果屬性值為變量，變量的值會被轉換為Boolean類型 |
| Number | 數字 | 1, 2.5 |
| String | 字符串 | "string" |
| Array | 數組 | [ 1, "string" ] |
| Object | 對象 | { key: value } |
| EventHandler | 事件處理函數名 | "handlerName"是Page中定義的事件處理函數名 |
| Any | 任意屬性 |
所有組件都有的屬性：
| 屬性名 | 類型 | 描述 | 注解 |
|---|---|---|---|
| id | String | 組件的唯一標示 | 保持整個頁面唯一 |
| class | String | 組件的樣式類 | 在對應的wxss中定義的樣式類 |
| style | String | 組件的內聯樣式 | 可以動態設置的內聯樣式 |
| hidden | Boolean | 組件是否顯示 | 所有組件默認顯示 |
| data-* | Any | 自定義屬性 | 組件上觸發的事件時，會發送給事件處理函數 |
| bind* / catch* | EventHandler | 組件的事件 | 詳見事件 |
幾乎所有組件都有各自定義的屬性，可以對該組件的功能或樣式進行修飾，請參考各個組件的定義。
微信小程序基礎組件分為以下八大類：
小程序視圖容器(View Container)：
| 組件名 | 說明 |
|---|---|
| view | 視圖容器 |
| scroll-view | 可滾動視圖容器 |
| swiper | 可滑動的視圖容器 |
小程序基礎內容(Basic Content)：
| 組件名 | 說明 |
|---|---|
| icon | 圖標 |
| text | 文字 |
| progress | 進度條 |
小程序表單(Form)：
| 標簽名 | 說明 |
|---|---|
| button | 按鈕 |
| form | 表單 |
| input | 輸入框 |
| checkbox | 多項選擇器 |
| radio | 單項選擇器 |
| picker | 列表選擇器 |
| picker-view | 內嵌列表選擇器 |
| slider | 滑動選擇器 |
| switch | 開關選擇器 |
| label | 標簽 |
小程序導航(Navigation)：
| 組件名 | 說明 |
|---|---|
| navigator | 應用內跳轉 |
小程序多媒體(Media)：
| 組件名 | 說明 |
|---|---|
| audio | 音頻 |
| image | 圖片 |
| video | 視頻 |
小程序地圖(Map)：
| 組件名 | 說明 |
|---|---|
| map | 地圖 |
小程序畫布(Canvas)：
| 組件名 | 說明 |
|---|---|
| canvas | 畫布 |
小程序客服會話：
| 組件名 | 說明 |
|---|---|
| contact-button | 進入客服會話按鈕 |
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
