tab切換調(diào)用接口次數(shù)太多，該如何優(yōu)化，不浪費(fèi)？

上緩存就可以了.
用一個(gè)對象(dataMap)保存分頁數(shù)據(jù).全部/提現(xiàn)/已提現(xiàn)都作為它的一個(gè)屬性,另外再維護(hù)一個(gè)currentData.切換tab的時(shí)候,使currentData指向相應(yīng)的對象,如果沒有則請求接口,并添加到dataMap上.頁面與currentData綁定.

先全部加載，然后再根據(jù)tab切換控制dom的顯示隱藏

后端給的接口應(yīng)該是有一個(gè)變量參數(shù)的 你只需要寫一個(gè)函數(shù) 傳給后端不通的參數(shù)就行了，例如：0=全部，1=提現(xiàn)中，2=已提現(xiàn)。
在頁面加載時(shí)候 寫一個(gè)函數(shù)三次invoking，這樣 就不至于每次點(diǎn)擊都請求一次。
至于分頁的話也是如此，切換到當(dāng)前tab 點(diǎn)擊下一頁傳好參數(shù)就可以了。

對于這種 你要是覺得你所謂的浪費(fèi)就不要用接口，非要用的話你就再加上個(gè)本地緩存

對于這種，我是寫三個(gè)方法，每個(gè)方法都有對應(yīng)的一個(gè)分頁參數(shù)，頁面一進(jìn)來就把這三個(gè)方法全部調(diào)用一遍，之后它怎么切換 都不會(huì)觸發(fā)方法，唯一改變的是 上拉加載 是對應(yīng)哪個(gè)分頁方法，比如現(xiàn)在的狀態(tài)是全部，上拉加載只觸發(fā)全部的方法，之后切換提現(xiàn)中狀態(tài)再切換回全部 也不會(huì)重新加載。

我之前也考慮過只寫一種方法，然后點(diǎn)擊某個(gè)狀態(tài)傳入相應(yīng)的參數(shù)來調(diào)用，但是這個(gè)不好的地方是 它切換到其它tab在切換回來，之前的數(shù)據(jù)就沒了，又要重新加載，這個(gè)對用戶體驗(yàn)不怎么好。

具體選哪種 就看實(shí)際情況哪種更合適吧

我覺得并不算是浪費(fèi)，看你這個(gè)位置的需求，更合理的應(yīng)該是，做一個(gè)flag，在第一次點(diǎn)擊某一個(gè)tab時(shí)，加載當(dāng)前tab頁的數(shù)據(jù)，并且支持當(dāng)前頁面的下拉刷新，保證用戶想要的提現(xiàn)信息是實(shí)時(shí)的。多次點(diǎn)擊tab也只會(huì)請求3次，用戶主動(dòng)下拉刷新也不存在浪費(fèi)一說。

沒太理解你所謂的“浪費(fèi)”是啥意思~

比如 后端定義接口 xxx.xx?status=[int] 當(dāng)傳0時(shí)，查詢?nèi)浚?時(shí)，提現(xiàn)中；2時(shí)，已提現(xiàn)。

這樣寫一個(gè)通用的函數(shù) function xx(status, cb) {}

on('tab', (function () {
  var data = {}
  return function async (tabId) {
    const res = await Promise.resolve(data[tabId] || fetch(`url?tabId=${tabId}`).then(res => res.json()))
    data[tabId] = res
  }
})())