启用keepalive的页面缓存功能

src/components/ec_api/BasicConfig.vue

@@ -192,19 +192,6 @@ function store_data() {
   store.commit('ecApiModule/change_ec_select_api', SelectApi.value)
 }
 
-// 切换回接口测试页面需要重新加载
-function restore_data() {
-  SelectEnv.value = store.state.ecApiModule.ec_api_data.env
-  SelectCinema.value = store.state.ecApiModule.ec_api_data.cinema
-  SelectType.value = store.state.ecApiModule.ec_api_data.type
-  SelectChannel.value = store.state.ecApiModule.ec_api_data.channel
-  SelectApiGroup.value = store.state.ecApiModule.ec_api_data.api_group
-  SelectApiId.value = store.state.ecApiModule.ec_api_data.select_api_id
-  CinemaByEnv.value = store.state.ecApiModule.ec_api_data.cinema_env
-  ChannelByType.value = store.state.ecApiModule.ec_api_data.channel_type
-  SelectApi.value = store.state.ecApiModule.ec_api_data.select_api ? store.state.ecApiModule.ec_api_data.select_api : []
-}
-
 onMounted(() => {
   console.log('onMounted BasicConfig')
   SelectType.value = store.state.ecApiModule.ec_api_data.type
@@ -220,10 +207,6 @@ onMounted(() => {
   get_api_by_type(SelectType.value)
   // 获取接口参数
   get_api_params_by_type(SelectType.value)
-
-  // 恢复数据
-  restore_data()
-  console.log('BasicConfig onMounted store.state.ecApiModule.ec_api_data', store.state.ecApiModule.ec_api_data)
 })
 
 

src/layout/index.vue

@@ -3,6 +3,9 @@
 import Index from "@/views/update/index.vue";
 import PageHeader from "@/layout/components/PageHeader.vue";
 import PageAside from "@/layout/components/PageAside.vue";
+import {useRoute} from 'vue-router'
+
+const route = useRoute()
 </script>
 
 <template>
@@ -16,7 +19,12 @@ import PageAside from "@/layout/components/PageAside.vue";
 <!--          <PageHeader/>-->
 <!--        </el-header>-->
         <el-main>
-          <router-view/>
+          <router-view v-slot="{Component}">
+            <keep-alive>
+              <component :is="Component" v-if="route.meta.keepAlive"/>
+            </keep-alive>
+            <component :is="Component" v-if="!route.meta.keepAlive"/>
+          </router-view>
         </el-main>
       </el-container>
     </el-container>

src/request/index.js

@@ -5,11 +5,9 @@ import config from "@/request/config.js";
 // import router from "@/router";
 
 function request(options) {
-    console.log(options)
     const instance = axios.create({...config})
 
     options = {...options, instance} // 使用创建的实例
-    console.log(options)
     // 请求拦截器
     instance.interceptors.request.use(
         config => {

src/router/index.js

@@ -6,26 +6,41 @@ const routes = [
         path: '/',
         name: 'Home',
         component: Layout,
+        meta:{
+            keepAlive: true,
+        },
         children: [
             {
                 path: '/',
                 name: 'hello',
-                component: () => import('@/components/HelloWorld.vue')
+                component: () => import('@/components/HelloWorld.vue'),
+                meta:{
+                    keepAlive: true,
+                }
             },
             {
                 path: 'update',
                 name: 'Update',
-                component: () => import('@/views/update/index.vue')
+                component: () => import('@/views/update/index.vue'),
+                meta:{
+                    keepAlive: false,
+                }
             },
             {
                 path: 'mock',
                 name: 'Mock',
                 component: () => import('@/views/mock/index.vue'),
+                meta:{
+                    keepAlive: false,
+                }
             },
             {
                 path: 'ec_api',
                 name: 'EcApi',
                 component: () => import('@/views/ec_api/index.vue'),
+                meta:{
+                    keepAlive: true,
+                }
             }
         ]
     }