宣告

bug： 在onShow中執行this.onLoad()，會導致頁面第一次載入的時候陣列載入兩次！
造成原因：頁面載入先執行onLoad，再執行的onShow，就會出現在onLoad載入一次資料，在onShow中執行this.onLoad()在載入一次資料。
解決辦法：將不需要重新整理的資料放在onLoad中執行，將需要重新整理的資料放在onShow中執行！
感謝：感謝editplusx的指正！

HTML實現當前頁面重新整理

首先我們都知道在HTML頁面我們要實現當前頁面重新整理一般會怎麼解決呢？
1，reload()方法重新整理當前頁面；
2，replace() 方法重新整理當前頁面；
3，頁面自動重新整理當前頁面；

三種實現js 重新整理當前頁面的方法用法

微信小程式—-返回上一頁重新整理或當前頁重新整理

1，在實現效果之前，需要知道微信小程式的頁面生命週期，不是很清楚的可以看微信小程式—-頁面生命週期；
2，可以知道微信小程式的頁面是由onLoad（頁面載入）、onReady（頁面初次渲染完成）、onShow（頁面顯示）、onHide（頁面隱藏）、onUnload（頁面解除安裝）五個週期構成；
3，知道了頁面的生命週期，如何實現返回重新整理和當前頁重新整理呢？又在什麼場景需要頁面重新整理效果呢？

當前頁面重新整理

場景：

在這個電商充斥著生活各個角落的時代，都知道在購物過程會給使用者生成訂單，如果使用者不滿意或者收貨等就需要去修改訂單狀態，在開發過程中，當用戶修改訂單成功後，後臺一般會返回提示是否修改成功，而不會返回這個訂單的詳細情況。那麼我們如何使前端頁面更新這個訂單的狀態呢？一般有兩種方法實現：1，人為的修改前端的資料；2，再次請求資料（也就是頁面重新整理）。
為實現取消訂單重新整理效果：

實現取消訂單重新整理效果：

在這裡實現需要實現的就是當前頁面重新整理，在講場景的時候都說了，實現的方式是再次請求資料進行更新，如何再次請求資料？就是周期函式的onLoad，將頁面重新載入，但是需要注意的是必須對相關data變數進行初始化。

更新訂單狀態函式的程式碼：

//更新訂單狀態函式
updateOrder(orderID, orderState, title){
    //獲取使用者儲存在本地的個人資訊
    let account = wx.getStorageSync('accountInfo'); 
    //請求伺服器介面更新訂單狀態
    app.globalMethod.REQUEST({
      url: urlList.updateOrderStateUrl,
      data: {
        accountID: account.accountID,
        passWord: account.passWord,
        orderID: orderID,
        orderState: orderState,
        token: ''
 

      },
      success: res => {
        // console.log(res)
        //如果更新成功
        if(res.data.state == '1'){
            //提示使用者訂單狀態修改成功
          wx.showToast({title: '您已' + title,success: res => {
            //在提示的成功函式中初始化當前載入訂單頁為第一頁，清空訂單列表資料
            this.setData({ currentPage: 1,orderList: []});
            //用onLoad週期方法重新載入，實現當前頁面的重新整理
            this.onLoad()
          }})
        }
      }
    })
  }

返回上一頁重新整理

場景：

電商購買物品時填寫地址，然後返回購買頁面，更新填寫的新地址。
為實現返回重新整理效果：

實現返回重新整理效果：

1，通過頁面的生命週期，可以知道在微信小程式中，實現返回上一頁的時候其實是直接將隱藏的頁面再顯示出來，所以不存在頁面的再次載入，但是如果業務需求再次載入，在麼實現？
2， 通過上邊的邏輯可以看出過程是： A頁面 —》 B頁面（改變A頁面的資料）（在A跳轉B的過場實現是A頁面隱藏B頁面渲染） —》返回A頁面（更新A頁面資料）（返回過程是隱藏B頁面顯示A頁面）
3，通過上邊的流程，可以看出是在A頁面的顯示函式中執行載入函式（onShow(){this.onLoad()}）

更新收貨地址的程式碼：

onShow() { //返回顯示頁面狀態函式
    //錯誤處理
    //this.onLoad()//再次載入，實現返回上一頁頁面重新整理
    //正確方法
    //只執行獲取地址的方法，來進行區域性重新整理
}

總結

微信小程式要實現頁面重新整理，簡單的說就是在不同的地方執行onLoad周期函式。不過需要注意在重新整理時是否需要初始化變數，這個必須注意。

下載

遊戲列表