直擊根源：微信小程序中web-view再次刷新后頁面需要退兩次

背景

在上一章(直擊根源：vue項目微信小程序頁面跳轉web-view不刷新)解決了vue在小程序回退不刷新的問題之后，會引出了一個刷新的頁面需要點擊返回兩次才能返回上一個頁面

問題描述

在A頁面從B頁面帶了參數返回之后，A頁面會刷新，直接導致了，A頁面返回上一個頁面需要點擊兩次，其中點擊一次時還是A頁面。

解決方案

1. 首先第一個想法就是，設置一下退回按鈕直接跳到上一個頁面去；經過資料查找，回退按鈕是沒有直接觸發函數的，也就是說不能直接控制回退的功能。

2. 在尋找資料時，發現可以間接的觸發一個unload函數，於是嘗試在當前頁面退回按鈕點擊后，會立即觸發當前頁面的unload方法，在unload里面嘗試跳轉到A的前一頁，結果如下：

   1. 在第一次點擊退回，沒有觸發unload
   2. 再次點擊退回，成功觸發了unload
   

   與期望不符，預期unload第一次退回觸發才可以進行頁面跳轉

3. 那么是web-view刷新產生的這個頁面，也不能干掉，讓web-view刷新這個頁面就可以了，找了很多資料，沒有理出一個頭緒，web-view既然是第二次刷新產生的，那么讓只刷新第一次是不是就可以解決了，於是做了如下嘗試：

   在B頁面把A頁面的web-view的src變量置為空，然后在A頁面web-view上添加wx:if={{src!==''}}的條件控制，在src為空時銷毀web-view，然后在B頁面退回通過另一個變量把需要的url傳遞過去在A頁面onShow，再設置src為一個我們期望的跳轉url，總結一下：

    A頁面跳到B頁面時設置A的src為空-銷毀了`web-view`，退回A頁面時在onShow方法在設置src的值-`web-view`被重新渲染
   

   測試結果得到了預期：
   頁面被刷新，且沒有了A頁面退回兩次的情況

總結

1. web-view在src變化之后，會產生一個新的頁面，並加入的頁面棧里面
2. 刷新之后的頁面回退不會有unload方法調用
3. web-view銷毀重建可以避免產生新的頁面
4. 銷毀重建解

自此，微信小程序使用vue嵌套頁面刷新的核心問題都解決了