uni-app 重新编译后页面可以停留在原页面

起因

uni-app 进行小程序开发时，更改了相应的参数后，是需要进行重新编译，才能反馈在页面同中的，然后一旦重新编译的话，默认情况下后跳转到首页，也就是在pages.json中pages数组中的第一项。

对此uni-app是提供了有了condition https://uniapp.dcloud.io/collocation/pages.html#condition ，它是在pages.json中进行手动配置，更在于传入到页面的参数是并不容易拿到的。

因此希望可以通过某种方式可以最终达到，重新编译页面后，页面依旧可以停留在原先的页面，并且数据参数都是要与原来保持一致。

uni-app中的路由监听

如果我能进行uni-app中的路由拦截，并将拦截到的路由设置在storage中，编译后，再次进入到首页时，使用navigateTo直接跳转到原来的页面，一切便大功造成。

对于uni-app中的路由拦截可以使用官方的拦截器，https://uniapp.dcloud.io/api/interceptor.html#addinterceptor。 也可以采用重写路由的方式，如下：

const _navigateTo = uni.navigateTo

uni.navigateTo = (params) => {
        // 此处便是可以一些全局拦截操作
    _navigateTo(params)
}

问题在于,我们使用的原生的顶部栏，返回上一页，并不能被拦截到。而在微信小程序中，事件onBackPress是不起作用的。

因此这种方式不能很好的解决。https://uniapp.dcloud.io/tutorial/page.html#lifecycle

image.png

利用应用和页面的生命周期

基本的思路是在页面或者应用的销毁的销毁的生命周期时将当前页面的信息存储到storage，然后在页面加载时，跳转到原先的页面。

最终很遗憾的是，再次编译时是没有进入到 页面生命周期 onUnLoad中，也没有进入到组件生命周期 beforeDestory中的。

最终方案

在开发环境中使用定时器，不断将当前页面的值写入到Storage中，编译再次进入时跳转。

export function navigateToLastRoute() {
    let preRoute = getCurrentPage()
    const switchMenus= ['/pages/workbench/workbench','/pages/user/user']
    if (switchMenus.indexOf(preRoute) === -1) {
        uni.navigateTo({
            url: preRoute
        })
    }else{
        uni.switchTab({
            url:preRoute
        })
    }
    setInterval(() => {
        const routes = getCurrentPages()
        const fullPath = routes[routes.length - 1].$page.fullPath;
        if(preRoute !== fullPath){
            setCurrentPage(fullPath)
            preRoute = fullPath
        }   
    }, 4000)
}

通过了这种方式，特别对于层级很深的页面，不需要再编译之后一层层去点到之前的页面了，开发效率被大大提升。