perf keep-alive in nested route

This commit is contained in:
Pan 2018-01-24 16:34:01 +08:00
parent 6f2a7ce804
commit d431de0589
3 changed files with 29 additions and 13 deletions

View File

@ -6,14 +6,21 @@ const tagsView = {
mutations: { mutations: {
ADD_VISITED_VIEWS: (state, view) => { ADD_VISITED_VIEWS: (state, view) => {
if (state.visitedViews.some(v => v.path === view.path)) return if (state.visitedViews.some(v => v.path === view.path)) return
if (view.showInVisitedViews) {
state.visitedViews.push({ state.visitedViews.push({
name: view.name, name: view.name,
path: view.path, path: view.path,
title: view.meta.title || 'no-name' title: view.meta.title || 'no-name'
}) })
if (!view.meta.noCache) {
state.cachedViews.push(view.name)
} }
if (!view.meta.noCache) {
const cachedViews = [...state.cachedViews]
cachedViews.push(view.name)
state.cachedViews = Array.from(new Set([...cachedViews]))
}
console.log(state.cachedViews)
}, },
DEL_VISITED_VIEWS: (state, view) => { DEL_VISITED_VIEWS: (state, view) => {
for (const [i, v] of state.visitedViews.entries()) { for (const [i, v] of state.visitedViews.entries()) {

View File

@ -8,7 +8,7 @@
<script> <script>
export default { export default {
name: 'TableMain', name: 'Table',
computed: { computed: {
cachedViews() { cachedViews() {
return this.$store.state.tagsView.cachedViews return this.$store.state.tagsView.cachedViews

View File

@ -52,8 +52,11 @@ export default {
methods: { methods: {
generateTitle, // generateTitle by vue-i18n generateTitle, // generateTitle by vue-i18n
generateRoute() { generateRoute() {
if (this.$route.name) { let matched = [...this.$route.matched]
return this.$route matched.splice(0, 1)
matched = matched.filter(item => item.name)
if (matched) {
return matched
} }
return false return false
}, },
@ -61,11 +64,17 @@ export default {
return route.path === this.$route.path || route.name === this.$route.name return route.path === this.$route.path || route.name === this.$route.name
}, },
addViewTags() { addViewTags() {
const route = this.generateRoute() const routes = this.generateRoute()
if (!route) { if (!routes) {
return false return false
} }
this.$store.dispatch('addVisitedViews', route) const length = routes.length
routes.forEach((item, index) => {
if (index === length - 1) {
item.showInVisitedViews = true
}
this.$store.dispatch('addVisitedViews', item)
})
}, },
moveToCurrentTag() { moveToCurrentTag() {
const tags = this.$refs.tag const tags = this.$refs.tag