MUI框架前端開發知識點
阿新 • • 發佈:2018-11-19
1、mui-table-view列表
列表拉動反彈動畫效果,只需將列表放置在mui-scroll-wrapper、mui-scroll容器內。
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
//列表具體內容
</div>
</div>
列表需要用javaScript進行初始化才能滾動,如果列表的內容沒有超出螢幕範圍,也是不能滾動的,如果對.mui-table-view使用了絕對定位position: absolute,即使列表超出螢幕範圍,也是不能滾動的。
<script>
mui('.mui-scroll-wrapper').scroll({
});
</script>
注意:如需整個頁面具有反彈效果,則在預載入中的styles中新增屬性bounce: 'vertical',表示垂直方向可滑動反彈。此時則無需將列表放置在mui-scroll-wrapper、mui-scroll容器內。
mui.init({ swipeBack: false, statusBarBackground: '#f7f7f7', gestureConfig: { doubletap: true }, subpages: [{ id: 'list', url: 'list.html', styles: { top: '45px', bottom: 0, bounce: 'vertical' } }] });
2、本地資料儲存
使用plus.storage物件,呼叫該物件的以下方法:
//根據key獲取對應的value
plus.storage.getLength();
//增加或修改key-value對
plus.storage.setItem('key', 'value');
//根據key值刪除對應的key-value對
plus.storage.removeItem('key');
//清除所有key-value對
plus.storage.clear();
//獲取對應索引處的key值
plus.storage.key(index);
3、系統控制元件預設高度
頂部導航欄:44px
底部工具條:51px