From 169105358cbbd0014ca5f5f7ac1b37df2543d10f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=A2=81=E6=95=8F=E5=8D=8E?= <180657@gree.com.cn>
Date: Sat, 14 Dec 2019 15:05:47 +0800
Subject: [PATCH] feat[nested]:add cache nested router demo

---
 src/views/nested/menu1/index.vue               | 14 ++++++++++++++
 src/views/nested/menu1/menu1-2/index.vue       | 18 +++++++++++++++++-
 .../nested/menu1/menu1-2/menu1-2-1/index.vue   | 17 +++++++++++++++--
 .../nested/menu1/menu1-2/menu1-2-2/index.vue   | 17 +++++++++++++++--
 4 files changed, 61 insertions(+), 5 deletions(-)

diff --git a/src/views/nested/menu1/index.vue b/src/views/nested/menu1/index.vue
index 30cb6701..1846c546 100644
--- a/src/views/nested/menu1/index.vue
+++ b/src/views/nested/menu1/index.vue
@@ -5,3 +5,17 @@
     </el-alert>
   </div>
 </template>
+
+<script>
+export default {
+  name: 'Menu1',
+  computed: {
+    cachedViews() {
+      return this.$store.state.tagsView.cachedViews
+    },
+    key() {
+      return this.$route.path
+    }
+  }
+}
+</script>
diff --git a/src/views/nested/menu1/menu1-2/index.vue b/src/views/nested/menu1/menu1-2/index.vue
index 0c86276e..39b24a07 100644
--- a/src/views/nested/menu1/menu1-2/index.vue
+++ b/src/views/nested/menu1/menu1-2/index.vue
@@ -1,7 +1,23 @@
 <template>
   <div style="padding:30px;">
     <el-alert :closable="false" title="menu 1-2" type="success">
-      <router-view />
+      <keep-alive :include="cachedViews">
+        <router-view :key="key" />
+      </keep-alive>
     </el-alert>
   </div>
 </template>
+
+<script>
+export default {
+  name: 'Menu12',
+  computed: {
+    cachedViews() {
+      return this.$store.state.tagsView.cachedViews
+    },
+    key() {
+      return this.$route.path
+    }
+  }
+}
+</script>
diff --git a/src/views/nested/menu1/menu1-2/menu1-2-1/index.vue b/src/views/nested/menu1/menu1-2/menu1-2-1/index.vue
index f87d88f4..395dd40c 100644
--- a/src/views/nested/menu1/menu1-2/menu1-2-1/index.vue
+++ b/src/views/nested/menu1/menu1-2/menu1-2-1/index.vue
@@ -1,5 +1,18 @@
-<template functional>
+<template>
   <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1-2-1" type="warning" />
+    <el-alert :closable="false" title="menu 1-2-1" type="warning">
+      <el-input key="Menu121" v-model="input" />
+    </el-alert>
   </div>
 </template>
+
+<script>
+export default {
+  name: 'Menu121',
+  data() {
+    return {
+      input: ''
+    }
+  }
+}
+</script>
diff --git a/src/views/nested/menu1/menu1-2/menu1-2-2/index.vue b/src/views/nested/menu1/menu1-2/menu1-2-2/index.vue
index d88789f2..959e9a92 100644
--- a/src/views/nested/menu1/menu1-2/menu1-2-2/index.vue
+++ b/src/views/nested/menu1/menu1-2/menu1-2-2/index.vue
@@ -1,5 +1,18 @@
-<template functional>
+<template>
   <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1-2-2" type="warning" />
+    <el-alert :closable="false" title="menu 1-2-2" type="warning">
+      <el-input key="Menu122" v-model="input" />
+    </el-alert>
   </div>
 </template>
+
+<script>
+export default {
+  name: 'Menu122',
+  data() {
+    return {
+      input: ''
+    }
+  }
+}
+</script>