Procházet zdrojové kódy

feat(keep-alive): support Array for include and exclude (#5956)

* allow array index on keep-alive:include/exclude

* add Array in patternTypes

* fix flow type

* add flow type for include/exclude in watch

* add test case
JK před 8 roky
rodič
revize
51c595a7ce

+ 7 - 5
src/core/components/keep-alive.js

@@ -5,14 +5,16 @@ import { getFirstComponentChild } from 'core/vdom/helpers/index'
 
 type VNodeCache = { [key: string]: ?VNode };
 
-const patternTypes: Array<Function> = [String, RegExp]
+const patternTypes: Array<Function> = [String, RegExp, Array]
 
 function getComponentName (opts: ?VNodeComponentOptions): ?string {
   return opts && (opts.Ctor.options.name || opts.tag)
 }
 
-function matches (pattern: string | RegExp, name: string): boolean {
-  if (typeof pattern === 'string') {
+function matches (pattern: string | RegExp | Array<string>, name: string): boolean {
+  if (Array.isArray(pattern)) {
+    return pattern.indexOf(name) > -1
+  } else if (typeof pattern === 'string') {
     return pattern.split(',').indexOf(name) > -1
   } else if (isRegExp(pattern)) {
     return pattern.test(name)
@@ -62,10 +64,10 @@ export default {
   },
 
   watch: {
-    include (val: string | RegExp) {
+    include (val: string | RegExp | Array<string>) {
       pruneCache(this.cache, this._vnode, name => matches(val, name))
     },
-    exclude (val: string | RegExp) {
+    exclude (val: string | RegExp | Array<string>) {
       pruneCache(this.cache, this._vnode, name => !matches(val, name))
     }
   },

+ 36 - 0
test/unit/features/component/component-keep-alive.spec.js

@@ -272,6 +272,24 @@ describe('Component keep-alive', () => {
     sharedAssertions(vm, done)
   })
 
+  it('include (array)', done => {
+    const vm = new Vue({
+      template: `
+        <div v-if="ok">
+          <keep-alive :include="['one']">
+            <component :is="view"></component>
+          </keep-alive>
+        </div>
+      `,
+      data: {
+        view: 'one',
+        ok: true
+      },
+      components
+    }).$mount()
+    sharedAssertions(vm, done)
+  })
+
   it('exclude (string)', done => {
     const vm = new Vue({
       template: `
@@ -308,6 +326,24 @@ describe('Component keep-alive', () => {
     sharedAssertions(vm, done)
   })
 
+  it('exclude (array)', done => {
+    const vm = new Vue({
+      template: `
+        <div v-if="ok">
+          <keep-alive :exclude="['two']">
+            <component :is="view"></component>
+          </keep-alive>
+        </div>
+      `,
+      data: {
+        view: 'one',
+        ok: true
+      },
+      components
+    }).$mount()
+    sharedAssertions(vm, done)
+  })
+
   it('include + exclude', done => {
     const vm = new Vue({
       template: `