一、list教程
1）簡單場景：在頁面中實現 長列表 或者 螢幕滾動 等效果時，可以使用list。（平常會使用div，但是當dom結構複雜時，滾動頁面會出現卡頓現象，因為native無法復用div元件實現的列表元素）
而list由於會復用相同的type屬性的list-item,使得更加流暢。
使用list 元件**如下：
.........
載入更多
要實現dom片段的復用，要求相同type屬性的dom結構完全相同。所以，設定相同type屬性的list-item是優化列表滾動效能的關鍵；
注意：
list-item內不能再巢狀list
list-item 的type屬性為必填屬性
list-item內部需謹慎使用if指令或for指令，因為相同的type屬性的list-itemde dom結構必須完全相同，而使用if指令或for指令會造成dom結構差異；可以使用show指令代替if指令
2） 複雜場景：乙個商品列表頁，位於左邊和位於右邊的商品交錯顯示
列表中的列表元素可以分為三類，設定三種不同type屬性的 list-item。分別為：
a）在左，文字在右的list-item,type屬性自定義命名為productleft;
b ) 在右，文字在左的list-item,type屬性自定義命名為productright;
c）載入更多 list-item,type屬性自定義命名為loadmore
.........
.........
載入更多
list元件效能優化： 精簡dom層級，復用list-item,細粒度劃分list-item，關閉scrollpage四個方面；
其中，精簡dom層級，復用list-item是使用list元件必須遵循的優化原則，細粒度劃分list-item,關閉scrollpage適用於部分場景；
細粒度劃分的list-item,即列表中相同的dom結構劃分為盡可能小的列表元素（即list-item）
關閉scrollpage：list元件支援屬性scrollpage，預設關閉，標誌是否將頂部頁面中非list元素隨list一起滾動。開啟scrollpage會降低list渲染效能，
因此在開發者開啟scrollpage前，推薦先嘗試將頂部頁面中非list的元素，作為一種或多種type屬性的list-item,移入list從而達到關閉scrollpage提高渲染效能的目的；
3）list-item懶載入
懶載入，簡稱 lazyload，本質上是按需載入；
在傳統頁面中，常用的lazyload優化網頁的效能：
實現：不載入全部頁面資源，當資源即將呈現在瀏覽器 可視區域 時，再載入資源；
優點：加快渲染的同時避免流量浪費
在框架中，開發者也可以使用lazy-load概念優化列表的渲染：
實現：提前fetch請求足夠的列表資料儲存在記憶體變數memlist中，當list滾動到底部時，從memlist中提取部分資料來渲染list-item。當memlist中資料不足時，提前fetch請求資料，填充memlist
優點：每次網路請求與頁面渲染的數量不一致，減少首屏渲染占用的js執行時間，較少渲染後續list-item的等待時間；
上述實現**：
import from '../../common/js/data';
//模擬fetch請求資料
function callfetch(callback),500)
}
//記憶體中儲存的列表資料
let memlist = ;
export default，
oninit())；
this.loadandrender();//獲取資料並渲染列表
}，
loadandrender(dorender = true )
else if(!reslist.length)else
}
}.bind(this))
},
_renderlist()
if(memlist.length<=this.size)
},
rendermorelistitem()
}
}
4）吸頂效果
傳統頁面的實現思路
a）當手指向上滑動超過吸頂元素的初始位置，把吸頂元素固定在頂部；
b）當手指向下滑動到底吸頂元素的初始位置時，取消吸頂元素在頂部的固定；
吸頂在傳統web頁面中的實現思路是監聽scroll事件，當頁面滾動到一定位置時，做一些事情來改變吸頂元素在視窗中的位置；
框架的實現思路
注意：在框架中scroll僅適用於list元件，且獲取的值是滾動的相對座標值，在使用時，需要通過累加來獲取當前滾動位置的絕對座標；
並且scroll在列表滾動時會被高頻觸發，存在潛在效能問題；
採用stack元件作為整個頁面的容器，stack元件的特性為：每個直接子元件按照先後順序依次堆疊，覆蓋前乙個子元件；
「吸頂」條件：
快應用 元件
自定義元件 為了更好的組織邏輯與 可以把頁面按照功能拆成多個模組，每個模組負責其中乙個功能部分，最後頁面將這些模組引入管理起來，傳遞業務與配置資料完成 分離 注意 自定義元件中資料模型只能使用data屬性，data型別可以是object 或 function 如果是函式，返回結果必須是物件 元件的引...
快應用 元件（map）
map元件 1 關於map元件的相關屬性 latitude longitude 調整地圖元件的中心位置 scale coordtype 縮放級別 2 地圖元件支援的四種覆蓋物，包括 marker,groundoverlay,polyline 和circle.markers latitude long...
卡片 元件 快應用元件庫H UI
h ui是一套為快應用開發者量身打製的ui元件庫，以傳統html5標籤為基礎，遵循主流前端框架樣式命名習慣，對快應用原生元件二次封裝而成，以實現快應用 全元件式開發 為目標，讓快應用開發就像搭積木！h ui是一套為快應用開發者量身打製的ui元件庫，以傳統html5標籤為基礎，遵循主流前端框架樣式命名...