成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

快應(yīng)用開發(fā)快速上手及簡(jiǎn)明教程

sean / 3389人閱讀

摘要：注冊(cè)賬號(hào)首先你需要一個(gè)手機(jī)廠商對(duì)應(yīng)開發(fā)者賬號(hào)和快應(yīng)用賬號(hào)由于博主的手機(jī)是華為，就在華為官網(wǎng)注冊(cè)一個(gè)個(gè)人開發(fā)者賬號(hào)就好啦，這個(gè)部分就不具體展開了。

博主的開發(fā)及調(diào)試環(huán)境是 macOS 10.13.4 + Chrome/65.0.3325.181 + honorV9 EMUI8.0.0(Android8.0.0)
本文適合有一定前端開發(fā)經(jīng)驗(yàn)的小伙伴（有一定經(jīng)驗(yàn)看原文檔太累贅了，而且環(huán)境配置部分原文寫的太零碎了），最后總結(jié)了一些開發(fā)過(guò)程中遇到的坑。附文檔鏈接：https://doc.quickapp.cn/


本文沒(méi)有提到的部分和正常前端開發(fā)保持一致，也可能是我還沒(méi)有遇到的坑。。。
注冊(cè)賬號(hào)

首先你需要一個(gè)手機(jī)廠商對(duì)應(yīng)開發(fā)者賬號(hào)和快應(yīng)用賬號(hào)

由于博主的手機(jī)是華為，就在華為官網(wǎng)注冊(cè)一個(gè)個(gè)人開發(fā)者賬號(hào)就好啦，這個(gè)部分就不具體展開了。相關(guān)地址快應(yīng)用也給我提供了一份列表和指南。值得說(shuō)明的是，這個(gè)賬號(hào)是需要實(shí)名制的，有上傳身份證照片和個(gè)人照片審核的，審核需要1-2個(gè)工作日（華為使用芝麻信用認(rèn)證可以即即刻生效，不知道其他廠家什么情況）。

然后打開快應(yīng)用官網(wǎng) https://www.quickapp.cn/, 點(diǎn)擊右上角的注冊(cè)，注冊(cè)一個(gè)快應(yīng)用賬號(hào)，這個(gè)部分很簡(jiǎn)單，也不展開了。
登陸以后我們可以看到導(dǎo)航欄上多出來(lái)一個(gè)開發(fā)者中心標(biāo)簽，點(diǎn)擊進(jìn)去，選擇【廠商賬號(hào)綁定】選項(xiàng)卡，選擇你的手機(jī)品牌方標(biāo)簽進(jìn)行綁定即可，目前小米、華為、金立、魅族、努比亞、OPPO 和 VIVO 都已經(jīng)可以綁定了，而中興、聯(lián)想和一加還不能綁定。該綁定過(guò)程同樣需要1-2個(gè)工作日審核。

安裝相關(guān)軟件和工具 開發(fā)工具

首先你需要安裝 node v6.11.3 這是快應(yīng)用官方推薦的版本
注意：不要使用 v8.0.* 這個(gè)版本內(nèi)部 ZipStream 實(shí)現(xiàn)與 node-archive 包不兼容，會(huì)引起報(bào)錯(cuò)

如果你已經(jīng)使用了 node 高版本，可以安裝 nvm 管理 node 版本(如果你是第一次安裝 node 可以直接安裝 v6 版本，跳過(guò)該步驟)。
安裝nvm, 注意不要使用 brew 安裝，因?yàn)?curl 安裝不需要手動(dòng)配置 .bashrc :

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.30.2/install.sh | bash

然后安裝對(duì)應(yīng)版本node:

nvm install v6.11.3

檢查當(dāng)前使用 node 版本：

nvm current

此時(shí)應(yīng)該已經(jīng)是我們需要的版本了，如果不是，可以手動(dòng)切換。查看已安裝的 node 版本，和切換到已安裝的版本：

nvm ls   # 查看已安裝版本
nvm use v6.11.3     # 使用已安裝版本

更多 nvm 用法直接輸入:

nvm --help

到這里，我們繼續(xù)快應(yīng)用開發(fā)，全局安裝腳手架:

npm install -g hap-toolkit

檢測(cè)是否安裝成功：

hap -V
調(diào)試工具

chrome 的 devTools 肯定是必不可少的。除此之外我們需要在手機(jī)安裝一下兩個(gè)應(yīng)用:快應(yīng)用調(diào)試器(左)，快應(yīng)用預(yù)覽平臺(tái)(右)

如果你不安裝【快應(yīng)用預(yù)覽平臺(tái)】，那么【快應(yīng)用調(diào)試器】中的按鈕都是不可點(diǎn)擊的。而【快應(yīng)用預(yù)覽平臺(tái)】里面其實(shí)啥也看不到，就是一個(gè)供快應(yīng)用工作的殼。完整安裝好以后【快應(yīng)用調(diào)試器】如下圖。

當(dāng)然官方也給了一份 源碼, 方便大家熟悉生命周期，樣式，自定義組件，事件傳遞，組件使用。注意：下載后請(qǐng)記得操作：hap update --force，增加編譯支持。

最后 adb 安裝(Homebrew)：

brew cask install android-platform-tools

檢測(cè)是否安裝成功：

adb devices
Demo 項(xiàng)目生成

我們利用腳手架新建一個(gè)項(xiàng)目, 并且進(jìn)入該項(xiàng)目, init 過(guò)程中需要輸入項(xiàng)目名稱：

hap init demo && cd demo

注意：之后的所有操作都在這個(gè)目錄下面

這是 demo 目錄結(jié)構(gòu)

├── sign                      #rpk包簽名模塊
│   └── debug                 #調(diào)試環(huán)境
│       ├── certificate.pem   #證書文件
│       └── private.pem       #私鑰文件
├── src
│   ├── Common                #公用的資源和組件文件
│   │   └── logo.png          #應(yīng)用圖標(biāo)
│   ├── Demo                  #頁(yè)面目錄
│   |   └── index.ux          #頁(yè)面文件，可自定義頁(yè)面名稱
│   ├── app.ux                #APP文件，可引入公共腳本，暴露公共數(shù)據(jù)和方法等
│   └── manifest.json         #項(xiàng)目配置文件，配置應(yīng)用圖標(biāo)、頁(yè)面路由等
└── package.json              #定義項(xiàng)目需要的各種模塊及配置信息

需要注意的是，sign 用來(lái)存放簽名模塊，sign/debug 中有用于調(diào)試的證書的私鑰，但debug簽名由于是公開的，安全性無(wú)法保證。在 release 發(fā)布之前一定要添加 release 目錄并且寫入對(duì)應(yīng)的證書和私鑰：

openssl req -newkey rsa:2048 -nodes -keyout private.pem -x509 -days 3650 -out certificate.pem
mkdir sign/release && mv *.pem ./sign/release/

安裝相關(guān)依賴：

npm install

如果上面的安裝很慢，可以使用淘寶的資源：

 npm install --registry=https://registry.npm.taobao.org

腳手架已經(jīng)提供很多運(yùn)行方式：

npm run release     # 發(fā)布程序包，在 /dist/.signed.rpk，注意需要使用 release 簽名模塊
npm run build       # 生成 build 和 dist 兩個(gè)目錄。前者是臨時(shí)產(chǎn)出，后者是最終產(chǎn)出
npm run watch       # 文件保存時(shí)自動(dòng)編譯和調(diào)試
調(diào)試方法

項(xiàng)目已和產(chǎn)生了 rpk 包，在做好之前的準(zhǔn)備工作已后，運(yùn)行：

npm run server        # 當(dāng)然，你可以通過(guò) --port XXXX 指定端口，默認(rèn)12306

此時(shí)，會(huì)在控制臺(tái)和 http://localhost:12306 得到一個(gè)二維碼，利用【快應(yīng)用調(diào)試器】中的掃碼安裝，即可在手機(jī)上看到效果了。
此時(shí)你退出預(yù)覽界面，點(diǎn)擊【快應(yīng)用調(diào)試器】中的開始調(diào)試，會(huì)同步在 chrome Devtool 中打開調(diào)試窗口，原理同在 chrome://inspect 中使用的遠(yuǎn)程調(diào)試功能，如下圖：

調(diào)試可以采用一下三種方式：

npm run build # 手動(dòng)編譯 + 手動(dòng)刷新
npm run build && npm run notify # 手動(dòng)編譯 + 自動(dòng)刷新
npm run watch # 自動(dòng)編譯 + 自動(dòng)刷新

注意：使用遠(yuǎn)程調(diào)試請(qǐng)確保手機(jī)與PC在同一局域網(wǎng)

開發(fā)

IDE / Code Editor

VS Code: 搜索 Hap Extension 安裝插件即可

webStorm: 可以通過(guò) html 關(guān)聯(lián) ".ux" 文件

sublime: 選擇 html 高亮即可

Android Studio: 使用 Android Monitor 看 console

console

為了正常使用 console.log 修改 src/manifest.json 中的 config 如下：

{
　"config": {
  　　"logLevel": "debug"
  }
}

console 僅支持 info, log, warn, error, debug 方法。

LESS 支持

安裝 less、less-loader

在 style 標(biāo)簽上添加 lang="less" 屬性即可

Async Function 支持

安裝 babel-runtime

將 babel 注入項(xiàng)目全局

/* app.ux 文件（如果沒(méi)有自己在 Common 里建一個(gè)）*/

目錄結(jié)構(gòu) 與 manifest 目錄結(jié)構(gòu)

根目錄下的 sign 文件上文已經(jīng)提到過(guò)，其他文件目錄不再贅述，因?yàn)榍岸隧?xiàng)目大多如此，這里僅僅說(shuō) src 目錄：

src
├── manifest.json          # 配置文件
├── app.ux                 # 入口文件
├── Page1                  # 頁(yè)面1
│   ├── page1.ux
├── Page2                  # 頁(yè)面2
│   ├── page2.ux
└── Common                 # 公共頁(yè)面和資源
    ├── ComponentA.ux
    ├── ComponentB.ux
    └── xxx.png
manifest

manifest

屬性 類型 默認(rèn)值 必填 描述
package String - 是 應(yīng)用包名，確認(rèn)與原生應(yīng)用的包名不一致，推薦采用com.company.module的格式，如：com.example.demo
name String - 是 應(yīng)用名稱，6個(gè)漢字以內(nèi)，與應(yīng)用商店保存的名稱一致，用于在桌面圖標(biāo)、彈窗等處顯示應(yīng)用名稱
icon String - 是 應(yīng)用圖標(biāo)，提供192x192大小的即可
versionName String - 否 應(yīng)用版本名稱，如："1.0"
versionCode Integer - 是 應(yīng)用版本號(hào)，從1自增，推薦每次重新上傳包時(shí)versionCode+1
minPlatformVersion Integer - 否 支持的最小平臺(tái)版本號(hào)，兼容性檢查，避免上線后在低版本平臺(tái)運(yùn)行并導(dǎo)致不兼容；如果不填按照內(nèi)測(cè)版本處理
features Array - 否 接口列表，絕大部分接口都需要在這里聲明，否則不能調(diào)用，詳見每個(gè)接口的文檔說(shuō)明
config Object - 是 系統(tǒng)配置信息，詳見下面說(shuō)明
router Object - 是 路由信息，詳見下面說(shuō)明
display Object - 否 UI顯示相關(guān)配置，詳見下面說(shuō)明

config

用于定義系統(tǒng)配置和全局?jǐn)?shù)據(jù)。

屬性 類型 默認(rèn)值 描述
logLevel String log 打印日志等級(jí)，分為off,error,warn,info,log,debug
designWidth Integer 750 頁(yè)面設(shè)計(jì)基準(zhǔn)寬度，根據(jù)實(shí)際設(shè)備寬度來(lái)縮放元素大小
data Object - 全局?jǐn)?shù)據(jù)對(duì)象，屬性名不能以$或_開頭，在頁(yè)面中可通過(guò)this進(jìn)行訪問(wèn);如果全局?jǐn)?shù)據(jù)屬性與頁(yè)面的數(shù)據(jù)屬性重名，則頁(yè)面初始化時(shí)，全局?jǐn)?shù)據(jù)會(huì)覆蓋頁(yè)面中對(duì)應(yīng)的屬性值

router

用于定義頁(yè)面的組成和相關(guān)配置信息，如果頁(yè)面沒(méi)有配置路由信息，則在編譯打包時(shí)跳過(guò)。

屬性 類型 默認(rèn)值 描述
entry String - 首頁(yè)名稱
pages Object - 頁(yè)面配置列表，key值為頁(yè)面名稱（對(duì)應(yīng)頁(yè)面目錄名，例如Hello對(duì)應(yīng)"Hello"目錄），value為頁(yè)面詳細(xì)配置page，詳見下面說(shuō)明

router.page

用于定義單個(gè)頁(yè)面路由信息。

屬性 類型 默認(rèn)值 必填 描述
component String - 是 頁(yè)面對(duì)應(yīng)的組件名，與ux文件名保持一致，例如"hello" 對(duì)應(yīng) "hello.ux"
path String /<頁(yè)面名稱> 否 頁(yè)面路徑，例如“/user”,不填則默認(rèn)為/<頁(yè)面名稱>。path必須唯一,不能和其他page的path相同。下面page的path因?yàn)槿笔?會(huì)被設(shè)置為“/Index”："Index": {"component": "index"}
filter Object - 否 聲明頁(yè)面可以處理某種請(qǐng)求

router.page.filter

聲明頁(yè)面可以處理某種請(qǐng)求，頁(yè)面可以從$page獲取打開頁(yè)面的參數(shù)。filter的結(jié)構(gòu)如下：

"filter": {
  "": {
    "uri": ""
  }
}
屬性 類型 默認(rèn)值 必填 描述
action String - 是 請(qǐng)求的動(dòng)作，目前僅支持view這一種
uri Pattern - 是 請(qǐng)求的數(shù)據(jù)的匹配規(guī)則。必須是正則表達(dá)式。如https?://.*可以匹配所有http和https類型的網(wǎng)址。

display

用于定義與UI顯示相關(guān)的配置。

屬性 類型 默認(rèn)值 描述
backgroundColor String #ffffff 窗口背景顏色
fullScreen Boolean false 是否是全屏模式，默認(rèn)不會(huì)同時(shí)作用于titleBar，titleBar需要繼續(xù)通過(guò)titleBar控制
titleBar Boolean true 是否顯示titleBar
titleBarBackgroundColor String - 標(biāo)題欄背景色
titleBarTextColor String - 標(biāo)題欄文字顏色
titleBarText String - 標(biāo)題欄文字(也可通過(guò)頁(yè)面跳轉(zhuǎn)傳遞參數(shù)(titleBarText)設(shè)置)
menu Boolean false 是否顯示標(biāo)題欄右上角菜單按鈕
pages Object - 各個(gè)頁(yè)面的顯示樣式，key為頁(yè)面名（與路由中的頁(yè)面名保持一致），value為窗口顯示樣式，頁(yè)面樣式覆蓋default樣式。
template 結(jié)構(gòu)
開發(fā)基礎(chǔ) 保留字

除了傳統(tǒng)保留字，添加了 show tid 等;

生命周期

頁(yè)面生命周期

屬性 類型 參數(shù) 返回值 描述 觸發(fā)時(shí)機(jī)
onInit Function 無(wú) 無(wú) 監(jiān)聽頁(yè)面初始化 當(dāng)頁(yè)面完成初始化時(shí)調(diào)用，只觸發(fā)一次
onReady Function 無(wú) 無(wú) 監(jiān)聽頁(yè)面創(chuàng)建完成 當(dāng)頁(yè)面完成創(chuàng)建可以顯示時(shí)觸發(fā)，只觸發(fā)一次
onShow Function 無(wú) 無(wú) 監(jiān)聽頁(yè)面顯示 當(dāng)進(jìn)入頁(yè)面時(shí)觸發(fā)
onHide Function 無(wú) 無(wú) 監(jiān)聽頁(yè)面隱藏 當(dāng)頁(yè)面跳轉(zhuǎn)離開時(shí)觸發(fā)
onDestroy Function 無(wú) 無(wú) 監(jiān)聽頁(yè)面退出 當(dāng)頁(yè)面跳轉(zhuǎn)離開（不進(jìn)入導(dǎo)航棧）時(shí)觸發(fā)
onBackPress Function 無(wú) Boolean 監(jiān)聽返回按鈕動(dòng)作 當(dāng)用戶點(diǎn)擊返回按鈕時(shí)觸發(fā)。返回true表示頁(yè)面自己處理返回邏輯，返回false表示使用默認(rèn)的返回邏輯，不返回值會(huì)作為false處理
onMenuPress Function 無(wú) 無(wú) 監(jiān)聽菜單按鈕動(dòng)作 當(dāng)用戶點(diǎn)擊菜單按鈕時(shí)觸發(fā)

A頁(yè)面的生命周期接口的調(diào)用順序：

打開頁(yè)面A：onInit() -> onReady() -> onShow()

在頁(yè)面A打開頁(yè)面B：onHide()

從頁(yè)面B返回頁(yè)面A：onShow()

A頁(yè)面返回：onBackPress() -> onHide() -> onDestroy()

應(yīng)用生命周期

屬性 類型 參數(shù) 返回值 描述 觸發(fā)時(shí)機(jī)
onCreate Function 無(wú) 無(wú) 監(jiān)聽?wèi)?yīng)用創(chuàng)建 當(dāng)應(yīng)用創(chuàng)建時(shí)調(diào)用
onDestroy Function 無(wú) 無(wú) 監(jiān)聽?wèi)?yīng)用銷毀 當(dāng)應(yīng)用銷毀時(shí)觸發(fā)
預(yù)置對(duì)象

全局對(duì)象 (通過(guò) this 訪問(wèn))

的屬性 類型 參數(shù) 描述
$app Object - 應(yīng)用對(duì)象
$app.$def Object - 獲取在app.ux中暴露的對(duì)象
$app.$data Object - 獲取在manifest.json的config.data中聲明的全局?jǐn)?shù)據(jù)
$page Object - 頁(yè)面對(duì)象
$page.action String - 獲取打開當(dāng)前頁(yè)面的action。僅在當(dāng)前頁(yè)面是通過(guò)filter匹配的方式打開時(shí)有效，否則為undefined。參見manifest
$page.uri String - 獲取打開當(dāng)前頁(yè)面的uri。僅在當(dāng)前頁(yè)面是通過(guò)filter匹配的方式打開時(shí)有效，否則為undefined。參見manifest
$page.setTitleBar Function Object* -
$valid Boolean - 頁(yè)面對(duì)象是否有效
$visible Boolean - 頁(yè)面是否處于用戶可見狀態(tài)

* this.$page.setTitleBar 參數(shù)屬性包括：

{
  text: "Hello QuickApp",        //標(biāo)題欄文字
  textColor: "#ffff",            //文字顏色
  backgroundColor: "#434343",    //背景顏色
  backgroundOpacity: "0.8",      //背景透明度
  menu: false,      //是否在標(biāo)題欄右上角顯示菜單按鈕 | 設(shè)置當(dāng)前
}
屬性 類型 參數(shù) 描述
$element Function id: String 獲取指定id的組件dom對(duì)象，如果沒(méi)有指定id，則返回根組件dom對(duì)象用法：this.$element("xxx")獲取id為xxx的組件實(shí)例對(duì)象 this.$element() 獲取根組件實(shí)例對(duì)象
$root Function 無(wú) 獲取頂層ViewModel
$parent Function 無(wú) 獲取父親ViewModel
$child Function id: String 獲取指定id的自定義組件的ViewModel用法：this.$child("xxx") 獲取id為xxx的div組件ViewModel
$vm deprecated Function id: String 請(qǐng)使用上面this.$child("xxx")替代
$rootElement deprecated Function 無(wú) 請(qǐng)使用上面this.$element()替代
$forceUpdate Function 無(wú) 強(qiáng)制頁(yè)面刷新
公共屬性 類型 參數(shù) 描述
$set Function key: String
value: Any		 添加數(shù)據(jù)屬性，必須在onInit函數(shù)中使用，用法：this.$set("key",value)
$delete Function key: String 刪除數(shù)據(jù)屬性，如果在onInit函數(shù)中使用，用法：this.$delete("key")
元素屬性/方法 類型 參數(shù) 描述
$set Function key: String
value: Any		 添加數(shù)據(jù)屬性，用法：this.$vm("id").$set("key",value)
$delete Function key: String 刪除數(shù)據(jù)屬性，用法：this.$vm("id").$delete("key")
$on Function eventName: String
handler: Function		 在當(dāng)前頁(yè)面注冊(cè)監(jiān)聽事件， 可監(jiān)聽$emit()、 $dispatch()、 $broadcast()等觸發(fā)的自定義事件，不能用于注冊(cè)組件節(jié)點(diǎn)的事件響應(yīng)
$off Function eventName: String
handler: Function		 移除事件監(jiān)聽，參數(shù) fnHandler 為可選，傳遞僅移除指定的響應(yīng)函數(shù)，不傳遞則移除此事件的所有監(jiān)聽
$emit Function eventName: String
data: Object		 觸發(fā)當(dāng)前實(shí)例監(jiān)聽事件函數(shù)，與 $on() 配合使用

* 注意，獲取元素應(yīng)該在頁(yè)面已渲染后，如 onReady 事件中或 onReady 事件執(zhí)行完以后。

頁(yè)面設(shè)計(jì)

布局和尺寸

采用 border-box 模型且不支持 box-sizing 屬性

設(shè)計(jì)稿1px / 設(shè)計(jì)稿基準(zhǔn)寬度 = 框架樣式1px / 項(xiàng)目配置基準(zhǔn)寬度(項(xiàng)目配置基準(zhǔn)寬度:/src/manifest.json 中 config.designWidth 的值，默認(rèn)750)

CSS

可以使用內(nèi)聯(lián)樣式、tag選擇器、class選擇器、id選擇器來(lái)為組件設(shè)置樣式

僅可以使用并列選擇、后代選擇器、子代選擇器

支持@import引入外部樣式、內(nèi)聯(lián)樣式、行內(nèi)樣式

顏色值不支持縮寫，偽類支持不完全（支持:disabled,:checked,:focus等)

通用

通用事件：click, longpress, focus, blur, appear(組件出現(xiàn))，disappear(組件消失)，swipe(快速滑動(dòng)，參數(shù)direction:[left|right|up|down])

通用屬性： id, class, style, if, elif, else, for, show, disabled 等；

通用樣式：width, height, padding, padding-, margin, margin-, border, border-style, border-width, border-color, border--color, border--width, border-radius, border---radius, background-color, background-size, background-image(僅本地圖片), background-repeat, opacity, display(flex|none), flex, flex-grow, flex-shrick, flex-basis, position(none|fix), linear-gradient, repeating-inear-gradient, transform-origin, animation, animation-name, animation-delay, animation-duration, animation-iteration-count, animation-timing-function, animation-fill-mode, @key-frames(background-color|opacity|width|height|transform), transform(translate|translateX|translateY|rotate|rotateX|rotateY|scale|scaleX|scaleY)(以上*代表枚舉[left|right|top|bottom], 具體和 css 一致。注：縮寫形式和展開形式不要同時(shí)使用)

組件

默認(rèn)支持通用事件、屬性和樣式
、、、組件為文本容器組件，其它組件不能直接放置文本內(nèi)容

: 和 HTML 一樣

支持樣式 flex-direction, flex-wrap, justify-content, align-items, align-content

: 氣泡框

支持屬性 target 和 placement

支持樣式 mask-color

支持事件 visibilitychange

自組件只能是

: 下拉刷新

支持屬性 offset 和 refreshing

支持樣式 background-color 和 progress-color

支持事件 refresh

: 富文本編輯器

支持屬性 type(值為 html)

支持div樣式, height 無(wú)效

不支持子組件

: 子組件排列方式為層疊排列，每個(gè)直接子組件按照先后順序依次堆疊，覆蓋前一個(gè)子組件

支持div樣式

: 輪播視圖容器

支持屬性 index, interval, autoplay 和 indicator(是否顯示indicator)

支持樣式 indicator-color, indicator-selected-color 和 indicator-size

支持事件 change

支持方法 swipeTo(index)

: 選項(xiàng)卡

支持屬性 index

支持事件 change

子組件僅支持最多一個(gè)和最多一個(gè)

: 用來(lái)展示tab的標(biāo)簽區(qū)，子組件排列方式為橫向排列

支持屬性 mode(scrollable|fix)

支持樣式 height

支持事件 visibilitychange

: 用來(lái)展示tab的內(nèi)容區(qū)，高度默認(rèn)充滿tabs剩余空間，子組件排列方式為橫向排列

支持屬性 target 和 placement

支持樣式 mask-color

支持事件 visibilitychange

: 開發(fā)者在頁(yè)面中實(shí)現(xiàn)長(zhǎng)列表或者屏幕滾動(dòng)等效果時(shí)，習(xí)慣使用div組件做循環(huán)遍歷

子組件必須是 ;

支持屬性 scrollpage，默認(rèn)關(guān)閉，標(biāo)志是否將頂部頁(yè)面中非的元素隨一起滾動(dòng)。開啟 scrollpage 會(huì)降低渲染性能

組件的性能優(yōu)化分為: 精簡(jiǎn) DOM 層級(jí)、復(fù)用、細(xì)粒度劃分、關(guān)閉 scrollpage 四個(gè)方面

支持 flex-direction 和 column

具有方法scrollTo(num)和事件scroll, scrollBottom, scrollTop

list 的子元素

的子組件可以是任何標(biāo)簽或除以外的組件

有一個(gè)屬性 type，type 值相同的 后代 DOM 必須一模一樣，如果不一樣，請(qǐng)使用不同的 type 值。type 不能為空！

支持

樣式和 column-span，不支持 position

: 鏈接

支持屬性 href

href 屬性值可根據(jù)路由配置

href還支持http和https開頭的網(wǎng)址，點(diǎn)擊后會(huì)打開webview加載網(wǎng)頁(yè)

href還可以通過(guò)“?param1=value1”的方式添加參數(shù)，參數(shù)可以在頁(yè)面中通過(guò)this.param1的方式使用

子組件僅支持

僅支持 `text

支持 sms, tel, mailto

支持樣式 lines, color, font-style, font-weight(normal|bold),text-decoration, text-align, line-height, text-overflow

: 圖片

支持屬性 src 和 alt

支持樣式 resize-mode(cover|contain|stretch|center)

不支持子組件

: 進(jìn)度條

支持屬性 percent 和 type(horizontal|circular)

支持樣式 color 和 stroke-width

支持事件 visibilitychange

不支持子組件

: 星級(jí)評(píng)分

支持屬性 numstars(總數(shù)), stepsize(步長(zhǎng)), indicator(是否可操作)和 rating(值)

支持樣式 star-background, star-secondary, star-foreground（三種狀態(tài)的圖片）

支持事件 change，不支持click、longpress事件

不支持子組件

: 格式化的文本

只能作為與的子組件

不支持 show 和 disabled 屬性

支持樣式 color, font-size, font-style, font-weight(normal|bold),text-decoration

不支持任何事件

不支持子組件

: 文本內(nèi)容寫在標(biāo)簽內(nèi)容區(qū)，支持轉(zhuǎn)義字符""

僅支持與子組件

支持樣式 lines, color, font-style, font-weight(normal|bold),text-decoration, text-align, line-height, text-overflow

: 接收用戶的輸入

不支持子組件

支持屬性 type(button|checkbox|radio|text|email|date|time|number|password), name, value, checked 和 placeholder

支持樣式 color, placeholder-color, width, height 和 font-size

支持事件 change

支持方法 focus()

: 為input、textarea組件定義標(biāo)注

不支持子組件

支持屬性 target

支持樣式 lines, color, font-style, font-weight(normal|bold),text-decoration, text-align, line-height, text-overflow

不支持事件

: : 下拉菜單

僅支持

不支持 click 事件, 支持 change 事件

: 滑動(dòng)選擇器

不支持子組件

支持屬性 min, max, value 和 step

支持樣式 color, selected-color, padding 僅支持 left 和 right

支持事件 change

: 開關(guān)選擇

不支持子組件

支持屬性 checked

支持事件 change