fullpage效果實現：
情景需求：頁面分為上下塊，上方固定高，下方不固定高，做fullpage效果。如圖：
布局：
似乎這種情景，在小程序中只能采用縱向的flex布局，別無他法。上方固定高，下方flex:1;
fullpage效果方案探索一:
采用小程序組件:scroll-view。
先說個結論：這種方案實現不了fullpage效果，因為我無法阻止該組件的scroll事件。
再來談為什么要用這個組件：在小程序中，當以手勢滑動屏幕的時候，會拉扯頁面波動。導致fullpage 效果不那么完美。所以設想：利用scroll-view組件，當手勢滑動時候，頁面也跟隨滑動（這樣可以避免頁面波動），滑到一定位置頁面自動切換到下一屏幕。但是很可惜，愿望是美好的，現實是殘酷的。小程序的scroll-view組件，沒法阻止scroll事件。
fullpage效果方案探索二:
采用swiper方案
這里有個坑：在體驗小程序時候，swiper 有縱向方向。但是去文檔中查找，咋么也找不到。幸好有高人指點，設置"vertical=true"即可。不然這一方案也被否定了。
fullpage效果方案探索三:
自己動手
步驟一：封裝一個判斷手勢方向的函數
步驟二：結合動畫API animation 滑動頁面
數字run起來效果實現
情景需求：當點擊卡片的時候，卡片中間顯示一個數字，數字從0跑到100。如圖所示：
數字效果方案探索一：
采用定時器
關于這一塊核心代碼：
timer && clearInterval(timer);
timer = setInterval(function() {
if (startPercent >= endPercent) {
clearInterval(timer);
return;
}
startPercent++;
option.start_percent = startPercent;
me.setData({
topics: topics
});
}, 10);
但是在微信開發工具或者真機上，數字跑起來有明顯的卡頓現象，感覺小程序對定時器支持不好?。?/p>
數字效果方案探索二：
優化定時器代碼：降低設置setData({})的頻率，由startPercent++ 改為startPercent+=2; 延長定時器的時間，由10ms改為20ms。理由：在一定時間內，減少DOM操作(個人理解)。
timer && clearInterval(timer);
timer = setInterval(function() {
if (startPercent >= endPercent) {
clearInterval(timer);
return;
}
startPercent+=2;
option.start_percent = startPercent;
me.setData({
topics: topics
});
}, 20);
但事實是：沒有鳥用,卡頓依然存在。
數字效果方案探索三：
采用requestAnimationFrame
requestAnimationFrame是瀏覽器用于定時循環操作的一個接口，類似于setTimeout, 主要用途是按幀對網頁進行重繪。具體的就不在這介紹了！
timer = requestAnimationFrame(runNum);
function runNum(){
if(startPercent >= endPercent){
cancelAnimationFrame(timer);
return;
}
startPercent++;
option.start_percent = startPercent;
me.setData({
topics: topics
});
timer = requestAnimationFrame(runNum);
}
但事實是：小程序在ios 居然不支持requestAnimationFrame，報錯！！只好放棄。另外在安卓上，卡頓現象也依然存。
數字效果方案探索四：
采用canvas，利用canvas 和定時器畫數字。事實發現：卡頓消失了，但存一些bug。先來分析卡頓為什么消失了？個人覺的是：利用canvas,可以免去setData({topics: topics})這一步（類似于不操作DOM），所以整個畫面變得十分流暢。再來說bug:
- canvas遇到transform等，并不會隨著父級進行transform,而是保留在原地。
最后，再總結一些開發微信小程序遇到的坑：
- promise語法 在不同的開發工具版本中，支持情況不一樣。在0.10版本中支持，在0.11版本中不支持
- requestAnimationFrame 在IOS 中報錯
- canvas 并不會隨著父級進行transform，而是保留在原地； canvas需添加id,且id 名不能重復，否則畫布狀態為：display:none;
