您好,登錄后才能下訂單哦!
這篇文章將為大家詳細講解有關微信小程序組件列表的示例分析,小編覺得挺實用的,因此分享給大家做個參考,希望大家閱讀完這篇文章后可以有所收獲。
框架為開發者提供了一系列基礎組件,開發者可以通過組合這些基礎組件進行快速開發。
什么是組件:
組件是視圖層的基本組成單元。
組件自帶一些功能與微信風格的樣式。
一個組件通常包括開始標簽
和結束標簽
,屬性
用來修飾這個組件,內容
在兩個標簽之內。
<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進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。