微信小程式不同狀態下的分頁載入
之前做小程式的時候有一個需求是訂單列表有幾個不同訂單狀態的選項卡,要求之間點不同的訂單狀態頁面不重新整理,而且也要做分頁,所以比較棘手的問題就是每次分頁的資料不會錯亂,要準確的插入到指定的狀態之中去。
我的思路是這樣的,page,offset,total,dataend全部設定成陣列,每種狀態存不同data每次請求資料的時候都判斷下當前在哪個選項卡里面,通過這個再插入到指定數組裡面。
以下程式碼:
//設定變數 data{ //各個狀態的資料是否結束 dataEnd: [false, false, false, false, false], //各個狀態的頁 page:[0,0,0,0,0], allData:false,//全部訂單資料 dfkData: false,//待付款訂單資料 dfhData: false,//待發貨訂單資料 dshData: false,//待收貨訂單資料 ywcData: false,//已完成訂單資料 },
//獲取當前狀態
var index = this.data.activeIndex;
根據此index放入設定好的各種data裡面
相關推薦
微信小程式不同狀態下的分頁載入
之前做小程式的時候有一個需求是訂單列表有幾個不同訂單狀態的選項卡,要求之間點不同的訂單狀態頁面不重新整理,而且也要做分頁,所以比較棘手的問題就是每次分頁的資料不會錯亂,要準確的插入到指定的狀態之中去。我的思路是這樣的,page,offset,total,dataend全部設定
支付寶小程式開發之與微信小程式不同的地方
前言: 本文僅彙總微信小程式移植支付寶小程式過程中遇到的一些不同的地方,詳細請參考官方開發文件。 網路請求: 對於網路請求,基本上改動不大,也就支付寶小程式沒有responseType屬性及響應碼欄位改成了status。 使用者授權登入: 1. 登入: wx.login ====&nb
微信小程式全域性狀態管理,並提供Vuex的開發體驗
1. 概要 微信小程式的開發體驗類似vue和react,但是卻沒有提供全域性狀態管理的機制,所以狀態的共享只能通過屬性傳遞的方式來實現。這種做法在小規模的應用中尚可以滿足開發效率,但是在複雜的應用中元件的巢狀層次很深,屬性傳遞的路徑過長。 於是我就想利用小程式Page中的data
微信小程式如何實現下拉框效果?(程式碼示例)
wxml程式碼: <view class='top-text'> 選擇接收班級</view> <!-- 下拉框 --> <view class='top-selected' bindtap='bindShowMsg'> <
微信小程式 不同的移動裝置上應該如何設定rpx單位?
我們在做微信小程式的開發時,經常會遇到在寫樣式表的時候發現用PX的效果不太理想的情況。日常開發中,我們常用rem、em來做響應式佈局的畫素單位,他們都是相對單位。rem相對於文件的根元素,em相對
微信小程式實戰篇-下拉重新整理與載入更多
下拉重新整理 實現下拉重新整理目前能想到的有兩種方式 呼叫系統的API,系統有提供下拉重新整理的API介面 下拉重新整理API.png 監聽scroll-view,自定義下拉重新整理,還記得scroll-view裡面有一個bindscrollto
微信小程式頁面重新整理,下拉重新整理
最近做專案的時候略微研究了一下微信小程式的頁面重新整理機制.微信小程式的重新整理類似於Ajax的重新整理,可以通過setData實現部分頁面的重新整理,並不需要onLoad頁面.當然,微信小程式並沒有類似於網頁或者Android的頁面過載方法.重新整理頁面只能通過setDat
微信小程式登入狀態java後臺解密
一、登入流程圖 二、微信小程式端 doLogin:function(callback = () =>{}){ let that = this; wx.login({ success:function(loginRes){ if(l
微信小程式-自定義下拉重新整理
最近給別個公司做技術支援,要實現微信小程式上拉重新整理與下拉載入更多 微信給出的介面不怎麼友好,最終想實現效果類似QQ手機版 ,一共3種下拉重新整理狀態變化,文字+圖片+背景顏色 最終實現後的效果(這裡提示有個不同點就是,自定義了導航條,並且下拉的時候,自定義導航條必須固定) 小程式實現下拉載入2種方
微信小程式在ios下Echarts圖表不能滑動的解決方案
問題現象 這個問題的現象說起來很簡單。 小程式頁面中有一篇很長的文章,內部有一個Echarts圖表,手指上下滑動觀看內容。 但是手指滑動區域在Echarts圖表上時,頁面卻不能滑動了。 如下圖: 追蹤問題原因 因為在小程式上渲染圖表用到的是echarts-for-weixin這個元件,而這個元件確實不支援
微信小程式全域性狀態管理 wxscv
微信小程式中,資料狀態不同頁面中不能跨頁面同步更新,也就是缺失類似vuex,mobx,redux全域性的資料狀態管理功能。 有些人移植了這些庫,但是畢竟不是微信小程式生態的東西。 Tencent也釋出了類似的庫,叫做 westore,基於小程式開發,非常小巧好用,非常推薦。 但是由於重寫了Page方法,而現在
微信小程式 某個頁面直接返回首頁(微信小程式回退到首頁)
開啟小程式後,到三級頁面後點擊左上角的返回按鈕,能夠直接返回到首頁 正常 A -> B -> C 都是通過 wx.navigateTo 跳轉的,所以 wx.navigateBack 只能返回上一介面,如果要返回到A 介面就會出現 C -> B -> A
微信小程式 模仿拼多多搜尋頁
效果看拼多多的搜尋頁,先上張靜態圖 wxml <!-- 搜尋區 --> <view class='search-box'> <icon class='iconfont icon-xiaokuku'></icon> <te
微信小程式___返回上一頁攜帶引數的幾種方法
方法一 把引數資料放入本地快取( wx.setStorage(wx.setStorageSync)) 上一個頁面再從快取中取出(wx.getStorage(wx.getStorageSync)) 同時退出登入時要清除快取(wx.clearStorage(wx.clea
微信小程式之-返回上一頁
先介紹三種跳轉方式:1.B頁面自帶返回按鈕wx.navigateTo(OBJECT) 保留當前頁面,跳轉到應用內的某個頁面,使用wx.navigateBack可以返回到原頁面2.B頁面不帶返回按鈕wx.redirectTo(OBJECT) 關閉當前頁面,跳轉到應用內的某個頁
【微信小程式 五】ListView上拉載入
前端 listview.js var page = 0; var GetList = function (that) { that.setData({ hidden: false }); wx.request({ url: 'ht
微信小程式 關閉除錯模式後顯示載入中
踩坑小記 微信小程式無論是開發版還是體驗版,開啟除錯模式一切都OK,但關閉後就一直顯示載入中??? 1.wx.request呼叫的伺服器地址不能含有埠號; 2.獲取openid的時候一定要記得請求伺服器,伺服器請求並返回openid; 踩坑小計
微信小程式swiper如何獲得當前頁面的index
想要實現的效果:(滑動時顯示當前頁面index)看小程式的官方文件程式碼:index.wxml <swiper class='sw-tu' circular="true" current="0" bindchange='onSlideChangeEnd'>
微信小程式-動態列表項的順序載入動畫
效果 思路 1、最開始用了純CSS動畫animation,發現動畫需要重複寫,於是換使用transition動畫。 2、使用onReady()可以讓頁面載入好再顯示動畫以免動畫提前結束。
微信小程式——下拉重新整理(分頁)
1、先定義兩個變數: // 分頁,載入 hasMoreData:true, globalPage:0, 2、函式處理: 3、與後臺互動: 1)、在獲取列表的方法裡面,將下面兩個引數以及其他所需