今天學習了將上一章的所有核算的js，抽離出去，讓在其他地方可以直接調用，然后和適配抖音的辦法，封裝網絡請求；

抽離公共方法

如何將公共方法抽離？
1、在根目錄創建一個目錄，一般起名是:utils
2、寫一個js頁面
3、在js頁面中，要用export將方法暴露出去，
4、在需要的地方，先引用公共方法，然后直接調用

這是設置的公共方法頁面，如何引用呢？

這就是引用，先引用js頁面，然后只用記錄方法的名稱，但是在使用的時候，因為是方法，所以是要用括號的

用條件編譯對抖音小程序適配

為什么要對抖音進行適配，是因為抖音小程序是有左邊的圖標，那就需要把左邊的圖標進行計算，給自定義的標題要加上邊距，不會讓覆蓋設置的標題。

export const getLeftIncon = () => {// #ifdef MP-TOUTIAOlet {leftIcon: {left,width}} = tt.getCustomButtonBoundingClientRect();return left + parseInt(width);// #endif// #ifndef MP-TOUTIAOreturn 0// #endif
}

tt.getCustomButtonBoundingClientRect()：這是抖音開發中的api，可以獲取到詳細信息，這里只是做個記錄，大家知道有這個情況，如果要開發的時候，就需要做更改設計。
條件編譯，前面已經說過了，這里只說下，抖音在條件編譯中，是要設置成TOUTIAO的，

封裝網絡請求

前面的頁面，全部是本地靜態的圖片展示，現在使用網絡請求獲取圖片信息。訪問的地址：
咸蝦米API免費接口大全；這是老師提供的接口地址，大家可以使用。
正常請求，是使用uni.request()請求，傳遞參數等，例如：

  let res = await uni.request({url: "https://tea.qingnian8.com/api/bizhi/homeBanner"})if (res.data.errCode === 0) {bannerList.value = res.data.data} else {uni.showToast({title: "接口錯誤"})}

這就是正常情況下的網絡請求，但是當頁面請求過多的時候，在使用這種方式，會讓代碼量多，查找的時候很不方便，因此，可以將請求地址，放在特定的文件夾下。
在根目錄下創建一個文件：api文件
在api文件下創建一個js：apis.js
將所有網絡請求放在apis中；例如：

export function apiGetBanner(){return uni.request({url:"https://tea.qingnian8.com/api/bizhi/homeBanner"})
}

在請求頁面，使用下面的方法調用，這里需要知道，使用的是async…await的方式

const randomList = ref([]);const getDayRandom = async () => {let res=await apiGetDayRandom();randomList.value = res.data

這就是把請求放在apis.js文件中，減少重復性的代碼。但當頁面的請求多的時候，發現還是有重復性的很多代碼，這就得使用前面說過的ES6 Promise的用法，ES7 async/await異步處理同步化，異步處理進化史，這里有課程，可以多看看，前面已經說了，這里在說下
ES6 Promise的用法，ES7 async/await異步處理同步化，異步處理進化史
這就是把網絡請求的公共模塊，放在公共文件夾下utils，這里生成一個request.js文件，把請求的公共地址參數等，都做成以參的形式，例如：

//這是定義一個基礎網絡地址
const BASE_URL = 'https://tea.qingnian8.com/api/bizhi';
//config = {},這是給的默認為空，當不傳的時候，就是空
export function request(config = {}) {
//下面是參數設定，url：地址，data：參數；method：請求方式，默認GET；header：請求的keylet {url,data = {},method = "GET",header = {}} = config//這里是將傳過來的請求地址和原地址進行拼接url = BASE_URL + url// header['access-key'] = "xxxxxx"console.log(url);return new Promise((resolve, reject) => {uni.request({url,data,method,header,success: res => {if (res.data.errCode === 0) {resolve(res.data)} else if (res.data.errCode === 400) {uni.showModal({title: "錯誤提示",content: res.data.errMsg,showCancel: false})reject(res.data)} else {uni.showToast({title: res.data.errMsg,icon: "none"})reject(res.data)}},fail: err => {reject(err)}})})
}

這樣，就實現了網絡請求的封裝了，方便后期不論是修改還是維護。
最近感覺有點懈怠了，加油！！！