关于router的一些配置

前言

之前在网上下载的一个项目中看到了有关路由的一个配置，有些不理解，然后查了一些资料，记录一下：

先上代码：

import Vue from 'vue'
import VueRouter from 'vue-router'
import routes from './router/router'
import store from './store'
import {routerMode} from './config/env' //路由模式
import './config/rem' //配置的移动端的rem

Vue.use(VueRouter)	//Vue.use的作用在于有没有install
const router = new VueRouter({
    routes,
    mode:routerMode //路由模式，在config/env里配置
    ...
    strict: process.env.NODEE_ENV !== 'production',
    scrollBehavior (to, from, savedPosition) {
        if (savePosition) {
            return savaPosition
        } else {
            if (from.meta.keepAlive) {
                from.meta.savePosition = document.body.scrollTop
            }
            return { x: 0, y: to.meta.savePosition || 0 }
        }
    }
})

new Vue({
    router,	//路由
    store,	//vuex状态（数据）管理
}).$mount('#app')	//vue实例

关于路由模式（routerMode）可以看我之前写的笔记：juejin.cn/post/684490…

关于scrollBehavior---scrollBehavior这个整体做的是：在路由的history模式下，一些列表页利用缓存模式来记录位置（一般是返回不刷新，前进刷新），一般用了scrollBehavior，同时还用keep-alive(缓存)，activated(缓存下触发的钩子函数)配合做列表页的返回记录位置。缓存模式的坑在于何时清楚缓存，一般是从新进入页面就清除。scrollBehavior---滚动行为：例如一个列表页，滑动了很多，点进去，再返回记录刚刚的位置。

strict: vuex可以参照官方文档：vuex.vuejs.org/zh/guide/st…