框架為開發(fā)者提供了一系列基礎(chǔ)組件，開發(fā)者可以通過組合這些基礎(chǔ)組件進行快速開發(fā)。
<tagname property="value">
Content goes here ...
</tagename>
| 類型 | 描述 | 注解 |
|---|---|---|
| Boolean | 布爾值 | 組件寫上該屬性，不管該屬性等于什么，其值都為true，只有組件上沒有寫該屬性時，屬性值才為false。如果屬性值為變量，變量的值會被轉(zhuǎn)換為Boolean類型 |
| Number | 數(shù)字 | 1, 2.5 |
| String | 字符串 | “string” |
| Array | 數(shù)組 | [ 1, “string” ] |
| Object | 對象 | { key: value } |
| EventHandler | 事件處理函數(shù)名 | “handlerName” 是 Page中定義的事件處理函數(shù)名 |
| Any | 任意屬性 |
| 屬性 | 類型 | 描述 | 注解 |
|---|---|---|---|
| id | String | 組件的唯一標(biāo)示 | 保持整個頁面唯一 |
| class | String | 組件的樣式類 | 在對應(yīng)的 WXSS 中定義的樣式類 |
| style | String | 組件的內(nèi)聯(lián)樣式 | 可以動態(tài)設(shè)置的內(nèi)聯(lián)樣式 |
| hidden | String | 組件是否顯示 | 所有組件默認顯示 |
| data-* | Any | 自定義屬性 | 組件上觸發(fā)的事件時，會發(fā)送給事件處理函數(shù) |
| bind* / catch* | EventHandler | 組件的事件 |
基礎(chǔ)組件分為以下幾類：
| 組件名 | 注釋 | 組件屬性 | ||||
|---|---|---|---|---|---|---|
| 屬性名 | 類型 | 默認值 | 說明 | 最低版本 | ||
| view | 視圖容器 | hover-class | String | none | 指定按下去的樣式類。當(dāng) hover-class="none" 時，沒有點擊態(tài)效果 | |
| hover-stop-propagation | Boolean | false | 指定是否阻止本節(jié)點的祖先節(jié)點出現(xiàn)點擊態(tài) | 1.5.0 | ||
| hover-start-time | Number | 50 | 按住后多久出現(xiàn)點擊態(tài)，單位毫秒 | |||
| hover-stay-time | Number | 400 | 手指松開后點擊態(tài)保留時間，單位毫秒 | |||
| scroll-view | 可滾動視圖容器 | scroll-x | Boolean | false | 允許橫向滾動 | |
| scroll-y | Boolean | false | 允許縱向滾動 | |||
| upper-threshold | Number | 50 | 距頂部/左邊多遠時（單位px），觸發(fā) scrolltoupper 事件 | |||
| lower-threshold | Number | 50 | 距底部/右邊多遠時（單位px），觸發(fā) scrolltolower 事件 | |||
| scroll-top | Number | 設(shè)置豎向滾動條位置 | ||||
| scroll-left | Number | 設(shè)置橫向滾動條位置 | ||||
| scroll-into-view | String | 值應(yīng)為某子元素id（id不能以數(shù)字開頭）。設(shè)置哪個方向可滾動，則在哪個方向滾動到該元素 | ||||
| scroll-with-animation | Boolean | false | 在設(shè)置滾動條位置時使用動畫過渡 | |||
| enable-back-to-top | Boolean | false | iOS點擊頂部狀態(tài)欄、安卓雙擊標(biāo)題欄時，滾動條返回頂部，只支持豎向 | |||
| bindscrolltoupper | EventHandle | 滾動到頂部/左邊，會觸發(fā) scrolltoupper 事件 | ||||
| bindscrolltolower | EventHandle | 滾動到底部/右邊，會觸發(fā) scrolltolower 事件 | ||||
| bindscroll | EventHandle | 滾動時觸發(fā)，event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} | ||||
| swiper | 滑塊視圖容器 | indicator-dots | Boolean | false | 是否顯示面板指示點 | |
| indicator-color | Color | rgba(0, 0, 0, .3) | 指示點顏色 | 1.1.0 | ||
| indicator-active-color | Color | #000000 | 當(dāng)前選中的指示點顏色 | 1.1.0 | ||
| autoplay | Boolean | false | 是否自動切換 | |||
| current | Number | 0 | 當(dāng)前所在頁面的 index | |||
| interval | Number | 5000 | 自動切換時間間隔 | |||
| duration | Number | 500 | 滑動動畫時長 | |||
| circular | Boolean | false | 是否采用銜接滑動 | |||
| vertical | Boolean | false | 滑動方向是否為縱向 | |||
| bindchange | EventHandle | current 改變時會觸發(fā) change 事件，event.detail = {current: current, source: source} | ||||
| 組件名 | 注釋 | 組件屬性 | ||||
|---|---|---|---|---|---|---|
| 屬性名 | 類型 | 默認值 | 說明 | 最低版本 | ||
| icon | 圖標(biāo) | type | String | icon的類型，有效值：success, success_no_circle, info, warn, waiting, cancel, download, search, clear | ||
| size | Number | 23 | icon的大小，單位px | |||
| color | Color | icon的顏色，同css的color | ||||
| text | 文字 | selectable | Boolean | false | 文本是否可選 | 1.1.0 |
| space | String | false | 顯示連續(xù)空格 有效值 ensp:中文字符空格一半大小 emsp:中文字符空格大小 nbsp:根據(jù)字體設(shè)置的空格大小 |
1.4.0 | ||
| decode | Boolean | false | 是否解碼 | 1.4.0 | ||
| progress | 進度條 | percent | Float | 無 | 百分比0~100 | |
| show-info | Boolean | false | 在進度條右側(cè)顯示百分比 | |||
| stroke-width | Number | 6 | 進度條線的寬度，單位px | |||
| color | Color | #09BB07 | 進度條顏色 （請使用 activeColor） | |||
| activeColor | Color | 已選擇的進度條的顏色 | ||||
| backgroundColor | Color | 未選擇的進度條的顏色 | ||||
| active | Boolean | false | 進度條從左往右的動畫 | |||
| active-mode | String | backwards | backwards: 動畫從頭播；forwards：動畫從上次結(jié)束點接著播 | 1.7.0 | ||
| 組件名 | 注釋 | 組件屬性 | |||||
|---|---|---|---|---|---|---|---|
| 屬性名 | 類型 | 默認值 | 說明 | 生效時機 | 最低版本 | ||
| button | 按鈕 | size | String | default | 按鈕的大小 | ||
| type | String | default | 按鈕的樣式類型 | ||||
| plain | Boolean | false | 按鈕是否鏤空，背景色透明 | ||||
| disabled | Boolean | false | 是否禁用 | ||||
| loading | Boolean | false | 名稱前是否帶 loading 圖標(biāo) | ||||
| form-type | String | 用于 <form/> 組件，點擊分別會觸發(fā) <form/> 組件的 submit/reset 事件 | |||||
| open-type | String | 微信開放能力 | 1.1.0 | ||||
| hover-class | String | button-hover | 指定按鈕按下去的樣式類。當(dāng) hover-class="none" 時，沒有點擊態(tài)效果 | ||||
| hover-stop-propagation | Boolean | false | 指定是否阻止本節(jié)點的祖先節(jié)點出現(xiàn)點擊態(tài) | 1.5.0 | |||
| hover-start-time | Number | 20 | 按住后多久出現(xiàn)點擊態(tài)，單位毫秒 | ||||
| hover-stay-time | Number | 70 | 手指松開后點擊態(tài)保留時間，單位毫秒 | ||||
| bindgetuserinfo | Handler | 用戶點擊該按鈕時，會返回獲取到的用戶信息，從返回參數(shù)的detail中獲取到的值同wx.getUserInfo | open-type="getUserInfo' | 1.3.0 | |||
| lang | String | en | 指定返回用戶信息的語言，zh_CN 簡體中文，zh_TW 繁體中文，en 英文。 | open-type="getUserInfo" | 1.3.0 | ||
| session-from | String | 會話來源 | open-type="contact" | 1.4.0 | |||
| send-message-title | String | 當(dāng)前標(biāo)題 | 會話內(nèi)消息卡片標(biāo)題 | open-type="contact" | 1.5.0 | ||
| send-message-path | String | 當(dāng)前分享路徑 | 會話內(nèi)消息卡片點擊跳轉(zhuǎn)小程序路徑 | open-type="contact" | 1.5.0 | ||
| send-message-img | String | 截圖 | 會話內(nèi)消息卡片圖片 | open-type="contact" | 1.5.0 | ||
| show-message-card | Boolean | false | 顯示會話內(nèi)消息卡片 | open-type="contact" | 1.5.0 | ||
| bindcontact | Handler | 客服消息回調(diào) | open-type="contact" | 1.5.0 | |||
| bindgetphonenumber | Handler | 獲取用戶手機號回調(diào) | open-type="getphonenumber" | 1.2.0 | |||
| form | 表單 | report-submit | Boolean | 是否返回 formId 用于發(fā)送模板消息 | |||
| bindsubmit | EventHandle | 攜帶 form 中的數(shù)據(jù)觸發(fā) submit 事件，event.detail = {value : {'name': 'value'} , formId: ''} | |||||
| bindreset | EventHandle | 表單重置時會觸發(fā) reset 事件 | |||||
| input | 輸入框 | value | String | 輸入框的初始內(nèi)容 | |||
| type | String | "text" | input 的類型 | ||||
| password | Boolean | false | 是否是密碼類型 | ||||
| placeholder | String | 輸入框為空時占位符 | |||||
| placeholder-style | String | 指定 placeholder 的樣式 | |||||
| placeholder-class | String | "input-placeholder" | 指定 placeholder 的樣式類 | ||||
| disabled | Boolean | false | 是否禁用 | ||||
| maxlength | Number | 140 | 最大輸入長度，設(shè)置為 -1 的時候不限制最大長度 | ||||
| cursor-spacing | Number | 0 | 指定光標(biāo)與鍵盤的距離，單位 px 。取 input 距離底部的距離和 cursor-spacing 指定的距離的最小值作為光標(biāo)與鍵盤的距離 | ||||
| auto-focus | Boolean | false | (即將廢棄，請直接使用 focus )自動聚焦，拉起鍵盤 | ||||
| focus | Boolean | false | 獲取焦點 | ||||
| confirm-type | String | "done" | 設(shè)置鍵盤右下角按鈕的文字 | 1.1.0 | |||
| confirm-hold | Boolean | false | 點擊鍵盤右下角按鈕時是否保持鍵盤不收起 | 1.1.0 | |||
| cursor | Number | 指定focus時的光標(biāo)位置 | 1.5.0 | ||||
| bindinput | EventHandle | 當(dāng)鍵盤輸入時，觸發(fā)input事件，event.detail = {value, cursor}，處理函數(shù)可以直接 return 一個字符串，將替換輸入框的內(nèi)容。 | |||||
| bindfocus | EventHandle | 輸入框聚焦時觸發(fā)，event.detail = {value: value} | |||||
| bindblur | EventHandle | 輸入框失去焦點時觸發(fā)，event.detail = {value: value} | |||||
| bindconfirm | EventHandle | 點擊完成按鈕時觸發(fā)，event.detail = {value: value} | |||||
| checkbox | 多項選擇器 | value | String | <checkbox/>標(biāo)識，選中時觸發(fā)<checkbox-group/>的 change 事件，并攜帶 <checkbox/> 的 value | |||
| disabled | Boolean | false | 是否禁用 | ||||
| checked | Boolean | false | 當(dāng)前是否選中，可用來設(shè)置默認選中 | ||||
| color | Color | checkbox的顏色，同css的color | |||||
| radio | 單項選擇器 | value | String | <radio/> 標(biāo)識。當(dāng)該<radio/> 選中時，<radio-group/> 的 change 事件會攜帶<radio/>的value | |||
| disabled | Boolean | false | 是否禁用 | ||||
| checked | Boolean | false | 當(dāng)前是否選中，可用來設(shè)置默認選中 | ||||
| color | Color | radio的顏色，同css的color | |||||
| picker (mode = selector) |
(普通)列表選擇器 | range | Array / Object Array | [] | mode為 selector 或 multiSelector 時，range 有效 | ||
| range-key | String | 當(dāng) range 是一個 Object Array 時，通過 range-key 來指定 Object 中 key 的值作為選擇器顯示內(nèi)容 | |||||
| value | Number | 0 | value 的值表示選擇了 range 中的第幾個（下標(biāo)從 0 開始） | ||||
| bindchange | EventHandle | value 改變時觸發(fā) change 事件，event.detail = {value: value} | |||||
| disabled | Boolean | false | 是否禁用 | ||||
| picker (mode = multiSelector) |
(多列)列表選擇器 | range | 二維Array / 二維Object Array | [] | mode為 selector 或 multiSelector 時，range 有效。二維數(shù)組，長度表示多少列，數(shù)組的每項表示每列的數(shù)據(jù)，如[["a","b"], ["c","d"]] | ||
| range-key | String | 當(dāng) range 是一個 二維Object Array 時，通過 range-key 來指定 Object 中 key 的值作為選擇器顯示內(nèi)容 | |||||
| value | Array | 0 | value 每一項的值表示選擇了 range 對應(yīng)項中的第幾個（下標(biāo)從 0 開始） | ||||
| bindchange | EventHandle | value 改變時觸發(fā) change 事件，event.detail = {value: value} | |||||
| bindcolumnchange | EventHandle | 某一列的值改變時觸發(fā) columnchange 事件，event.detail = {column: column, value: value}，column 的值表示改變了第幾列（下標(biāo)從0開始），value 的值表示變更值的下標(biāo) | |||||
| disabled | Boolean | false | 是否禁用 | ||||
| picker (mode = time) |
(時間)列表選擇器 | value | String | 表示選中的時間，格式為"hh:mm" | |||
| start | String | 表示有效時間范圍的開始，字符串格式為"hh:mm" | |||||
| end | String | 表示有效時間范圍的結(jié)束，字符串格式為"hh:mm" | |||||
| bindchange | EventHandle | value 改變時觸發(fā) change 事件，event.detail = {value: value} | |||||
| disabled | Boolean | false | 是否禁用 | ||||
| picker (mode = date) |
(日期)列表選擇器 | value | String | 0 | 表示選中的日期，格式為"YYYY-MM-DD" | ||
| start | String | 表示有效日期范圍的開始，字符串格式為"YYYY-MM-DD" | |||||
| end | String | 表示有效日期范圍的結(jié)束，字符串格式為"YYYY-MM-DD" | |||||
| fields | String | day | 有效值 year,month,day，表示選擇器的粒度 | ||||
| bindchange | EventHandle | value 改變時觸發(fā) change 事件，event.detail = {value: value} | |||||
| disabled | Boolean | false | 是否禁用 | ||||
| picker (mode = region) |
(日期)列表選擇器 | value | Array | [] | 表示選中的省市區(qū)，默認選中每一列的第一個值 | ||
| custom-item | String | 可為每一列的頂部添加一個自定義的項 | 1.5.0 | ||||
| bindchange | EventHandle | value 改變時觸發(fā) change 事件，event.detail = {value: value} | |||||
| disabled | Boolean | false | 是否禁用 | ||||
| picker-view | 內(nèi)嵌列表選擇器 | value | NumberArray | 數(shù)組中的數(shù)字依次表示 picker-view 內(nèi)的 picker-view-colume 選擇的第幾項（下標(biāo)從 0 開始），數(shù)字大于 picker-view-column 可選項長度時，選擇最后一項。 | |||
| indicator-style | String | 設(shè)置選擇器中間選中框的樣式 | |||||
| indicator-class | String | 設(shè)置選擇器中間選中框的類名 | 1.1.0 | ||||
| mask-style | String | 設(shè)置蒙層的樣式 | 1.5.0 | ||||
| mask-class | String | 設(shè)置蒙層的類名 | 1.5.0 | ||||
| bindchange | EventHandle | 當(dāng)滾動選擇，value 改變時觸發(fā) change 事件，event.detail = {value: value}；value為數(shù)組，表示 picker-view 內(nèi)的 picker-view-column 當(dāng)前選擇的是第幾項（下標(biāo)從 0 開始） | |||||
| slider | 滾動選擇器 | min | Number | 0 | 最小值 | ||
| max | Number | 100 | 最大值 | ||||
| step | Number | 0 | 步長，取值必須大于 0，并且可被(max - min)整除 | ||||
| disabled | Boolean | false | 是否禁用 | ||||
| value | Number | 0 | 當(dāng)前取值 | ||||
| color | Color | #e9e9e9 | 背景條的顏色（請使用 backgroundColor） | ||||
| selected-color | Color | #1aad19 | 已選擇的顏色（請使用 activeColor） | ||||
| activeColor | Color | #1aad19 | 已選擇的顏色 | ||||
| backgroundColor | Color | #e9e9e9 | 背景條的顏色 | ||||
| show-value | Boolean | false | 是否顯示當(dāng)前 value | ||||
| bindchange | EventHandle | 完成一次拖動后觸發(fā)的事件，event.detail = {value: value} | |||||
| bindchanging | EventHandle | 拖動過程中觸發(fā)的事件，event.detail = {value: value} | 1.7.0 | ||||
| switch | 開關(guān)選擇器 | checked | Boolean | false | 是否選中 | ||
| type | String | switch | 樣式，有效值：switch, checkbox | ||||
| bindchange | EventHandle | checked 改變時觸發(fā) change 事件，event.detail={ value:checked} | |||||
| color | Color | switch 的顏色，同 css 的 color | |||||
| label | 標(biāo)簽 | for | String | 綁定控件的 id | |||
| 組件名 | 注釋 | 組件屬性 | ||||
|---|---|---|---|---|---|---|
| 屬性名 | 類型 | 默認值 | 說明 | 最低版本 | ||
| navigator | 應(yīng)用鏈接 | url | String | 應(yīng)用內(nèi)的跳轉(zhuǎn)鏈接 | ||
| open-type | String | navigate | 跳轉(zhuǎn)方式 | |||
| delta | Number | 當(dāng) open-type 為 'navigateBack' 時有效，表示回退的層數(shù) | ||||
| hover-class | String | navigator-hover | 指定點擊時的樣式類，當(dāng)hover-class="none"時，沒有點擊態(tài)效果 | |||
| hover-stop-propagation | Boolean | false | 指定是否阻止本節(jié)點的祖先節(jié)點出現(xiàn)點擊態(tài) | 1.5.0 | ||
| hover-start-time | Number | 50 | 按住后多久出現(xiàn)點擊態(tài)，單位毫秒 | |||
| hover-stay-time | Number | 600 | 手指松開后點擊態(tài)保留時間，單位毫秒 | |||
| 值 | 說明 | 最低版本 |
|---|---|---|
| navigate | 對應(yīng) wx.navigateTo 的功能 | |
| redirect | 對應(yīng) wx.redirectTo 的功能 | |
| switchTab | 對應(yīng) wx.switchTab 的功能 | |
| reLaunch | 對應(yīng) wx.reLaunch 的功能 | 1.1.0 |
| navigateBack | 對應(yīng) wx.navigateBack 的功能 | 1.1.0 |
| 組件名 | 注釋 | 組件屬性 | ||||
|---|---|---|---|---|---|---|
| 屬性名 | 類型 | 默認值 | 說明 | 最低版本 | ||
| audio | 音頻 | id | String | audio 組件的唯一標(biāo)識符 | ||
| src | String | 要播放音頻的資源地址 | ||||
| loop | Boolean | false | 是否循環(huán)播放 | |||
| controls | Boolean | false | 是否顯示默認控件 | |||
| poster | String | 默認控件上的音頻封面的圖片資源地址，如果 controls 屬性值為 false 則設(shè)置 poster 無效 | ||||
| name | String | 未知音頻 | 默認控件上的音頻名字，如果 controls 屬性值為 false 則設(shè)置 name 無效 | |||
| author | String | 未知作者 | 默認控件上的作者名字，如果 controls 屬性值為 false 則設(shè)置 author 無效 | |||
| binderror | EventHandle | 當(dāng)發(fā)生錯誤時觸發(fā) error 事件，detail = {errMsg: MediaError.code} | ||||
| bindplay | EventHandle | 當(dāng)開始/繼續(xù)播放時觸發(fā)play事件 | ||||
| bindpause | EventHandle | 當(dāng)暫停播放時觸發(fā) pause 事件 | ||||
| bindtimeupdate | EventHandle | 當(dāng)播放進度改變時觸發(fā) timeupdate 事件，detail = {currentTime, duration} | ||||
| bindended | EventHandle | 當(dāng)播放到末尾時觸發(fā) ended 事件 | ||||
| image | 圖片 | src | String | 圖片資源地址 | ||
| mode | String | 'scaleToFill' | 圖片裁剪、縮放的模式 | |||
| lazy-load | Boolean | false | 圖片懶加載。只針對page與scroll-view下的image有效 | 1.5.0 | ||
| binderror | HandleEvent | 當(dāng)錯誤發(fā)生時，發(fā)布到 AppService 的事件名，事件對象event.detail = {errMsg: 'something wrong'} | ||||
| bindload | HandleEvent | 當(dāng)圖片載入完畢時，發(fā)布到 AppService 的事件名，事件對象event.detail = {height:'圖片高度px', width:'圖片寬度px'} | ||||
| video | 視頻 | src | String | 要播放視頻的資源地址 | ||
| initial-time | Number | 指定視頻初始播放位置 | 1.6.0 | |||
| duration | Number | 指定視頻時長 | 1.1.0 | |||
| controls | Boolean | true | 是否顯示默認播放控件（播放/暫停按鈕、播放進度、時間） | |||
| danmu-list | Object Array | 彈幕列表 | ||||
| danmu-btn | Boolean | false | 是否顯示彈幕按鈕，只在初始化時有效，不能動態(tài)變更 | |||
| enable-danmu | Boolean | false | 是否展示彈幕，只在初始化時有效，不能動態(tài)變更 | |||
| autoplay | Boolean | false | 是否自動播放 | |||
| loop | Boolean | false | 是否循環(huán)播放 | 1.4.0 | ||
| muted | Boolean | false | 是否靜音播放 | 1.4.0 | ||
| page-gesture | Boolean | false | 在非全屏模式下，是否開啟亮度與音量調(diào)節(jié)手勢 | 1.6.0 | ||
| direction | Number | 設(shè)置全屏?xí)r視頻的方向，不指定則根據(jù)寬高比自動判斷。有效值為 0（正常豎向）, 90（屏幕逆時針90度）, -90（屏幕順時針90度） | 1.7.0 | |||
| bindplay | EventHandle | 當(dāng)開始/繼續(xù)播放時觸發(fā)play事件 | ||||
| bindpause | EventHandle | 當(dāng)暫停播放時觸發(fā) pause 事件 | ||||
| bindended | EventHandle | 當(dāng)播放到末尾時觸發(fā) ended 事件 | ||||
| bindtimeupdate | EventHandle | 播放進度變化時觸發(fā)，event.detail = {currentTime, duration} 。觸發(fā)頻率 250ms 一次 | ||||
| bindfullscreenchange | EventHandle | 當(dāng)視頻進入和退出全屏是觸發(fā)，event.detail = {fullScreen, direction}，direction取為 vertical 或 horizontal | 1.4.0 | |||
| objectFit | String | contain | 當(dāng)視頻大小與 video 容器大小不一致時，視頻的表現(xiàn)形式。contain：包含，fill：填充，cover：覆蓋 | |||
| poster | String | 視頻封面的圖片網(wǎng)絡(luò)資源地址，如果 controls 屬性值為 false 則設(shè)置 poster 無效 | ||||
| 組件名 | 注釋 | 組件屬性 | ||||
|---|---|---|---|---|---|---|
| 屬性名 | 類型 | 默認值 | 說明 | 最低版本 | ||
| map | 地圖 | longitude | Number | 中心經(jīng)度 | ||
| latitude | Number | 中心緯度 | ||||
| scale | Number | 16 | 縮放級別，取值范圍為5-18 | |||
| markers | Array | 標(biāo)記點 | ||||
| covers | Array | 即將移除，請使用 markers | ||||
| polyline | Array | 路線 | ||||
| circles | Array | 圓 | ||||
| controls | Array | 控件 | ||||
| include-points | Array | 縮放視野以包含所有給定的坐標(biāo)點 | ||||
| show-location | Boolean | 顯示帶有方向的當(dāng)前定位點 | ||||
| bindmarkertap | EventHandle | 點擊標(biāo)記點時觸發(fā) | ||||
| bindcallouttap | EventHandle | 點擊標(biāo)記點對應(yīng)的氣泡時觸發(fā) | 1.2.0 | |||
| bindcontroltap | EventHandle | 點擊控件時觸發(fā) | ||||
| bindregionchange | EventHandle | 視野發(fā)生變化時觸發(fā) | ||||
| bindtap | EventHandle | 點擊地圖時觸發(fā) | ||||
| bindupdated | EventHandle | 在地圖渲染更新完成時觸發(fā) | 1.6.0 | |||
| 組件名 | 注釋 | 組件屬性 | ||||
|---|---|---|---|---|---|---|
| 屬性名 | 類型 | 默認值 | 說明 | 最低版本 | ||
| canvas | 畫布 | src | String | 要播放視頻的資源地址 | ||
| initial-time | Number | 指定視頻初始播放位置 | 1.6.0 | |||
| duration | Number | 指定視頻時長 | 1.1.0 | |||
| controls | Boolean | true | 是否顯示默認播放控件（播放/暫停按鈕、播放進度、時間） | |||
| danmu-list | Object Array | 彈幕列表 | ||||
| danmu-btn | Boolean | false | 是否顯示彈幕按鈕，只在初始化時有效，不能動態(tài)變更 | |||
| enable-danmu | Boolean | false | 是否展示彈幕，只在初始化時有效，不能動態(tài)變更 | |||
| autoplay | Boolean | false | 是否自動播放 | |||
| loop | Boolean | false | 是否循環(huán)播放 | 1.4.0 | ||
| muted | Boolean | false | 是否靜音播放 | 1.4.0 | ||
| page-gesture | Boolean | false | 在非全屏模式下，是否開啟亮度與音量調(diào)節(jié)手勢 | 1.6.0 | ||
| direction | Number | 設(shè)置全屏?xí)r視頻的方向，不指定則根據(jù)寬高比自動判斷。有效值為 0（正常豎向）, 90（屏幕逆時針90度）, -90（屏幕順時針90度） | 1.7.0 | |||
| show-progress | Boolean | true | 若不設(shè)置，寬度大于240時才會顯示 | 1.9.0 | ||
| show-fullscreen-btn | Boolean | true | 是否顯示全屏按鈕 | 1.9.0 | ||
| show-play-btn | Boolean | true | 是否顯示視頻底部控制欄的播放按鈕 | 1.9.0 | ||
| show-center-play-btn | Boolean | true | 是否顯示視頻中間的播放按鈕 | 1.9.0 | ||
| enable-progress-gesture | Boolean | true | 是否開啟控制進度的手勢 | 1.9.0 | ||
| bindplay | EventHandle | 當(dāng)開始/繼續(xù)播放時觸發(fā)play事件 | ||||
| bindpause | EventHandle | 當(dāng)暫停播放時觸發(fā) pause 事件 | ||||
| bindended | EventHandle | 當(dāng)播放到末尾時觸發(fā) ended 事件 | ||||
| bindtimeupdate | EventHandle | 播放進度變化時觸發(fā)，event.detail = {currentTime, duration} 。觸發(fā)頻率 250ms 一次 | ||||
| bindfullscreenchange | EventHandle | 當(dāng)視頻進入和退出全屏是觸發(fā)，event.detail = {fullScreen, direction}，direction取為 vertical 或 horizontal | 1.4.0 | |||
| objectFit | String | contain | 當(dāng)視頻大小與 video 容器大小不一致時，視頻的表現(xiàn)形式。contain：包含，fill：填充，cover：覆蓋 | |||
| poster | String | 視頻封面的圖片網(wǎng)絡(luò)資源地址，如果 controls 屬性值為 false 則設(shè)置 poster 無效 | ||||
您最近使用了：