Browse Source

fix #458 dynamic component using meta properties

Evan You 11 years ago
parent
commit
76c4d47569
2 changed files with 30 additions and 4 deletions
  1. 10 4
      src/directives/repeat.js
  2. 20 0
      test/unit/specs/directives/repeat_spec.js

+ 10 - 4
src/directives/repeat.js

@@ -277,7 +277,7 @@ module.exports = {
       meta.$value = raw
       meta.$value = raw
     }
     }
     // resolve constructor
     // resolve constructor
-    var Ctor = this.Ctor || this.resolveCtor(data)
+    var Ctor = this.Ctor || this.resolveCtor(data, meta)
     var vm = this.vm.$addChild({
     var vm = this.vm.$addChild({
       el: this.template.cloneNode(true),
       el: this.template.cloneNode(true),
       _linker: this._linker,
       _linker: this._linker,
@@ -296,16 +296,22 @@ module.exports = {
    * components depending on instance data.
    * components depending on instance data.
    *
    *
    * @param {Object} data
    * @param {Object} data
+   * @param {Object} meta
    * @return {Function}
    * @return {Function}
    */
    */
 
 
-  resolveCtor: function (data) {
+  resolveCtor: function (data, meta) {
+    // create a temporary context object and copy data
+    // and meta properties onto it.
+    // use _.define to avoid accidentally overwriting scope
+    // properties.
     var context = Object.create(this.vm)
     var context = Object.create(this.vm)
     for (var key in data) {
     for (var key in data) {
-      // use _.define to avoid accidentally
-      // overwriting scope properties
       _.define(context, key, data[key])
       _.define(context, key, data[key])
     }
     }
+    for (var key in meta) {
+      _.define(context, key, meta[key])
+    }
     var id = this.ctorGetter.call(context, context)
     var id = this.ctorGetter.call(context, context)
     var Ctor = this.vm.$options.components[id]
     var Ctor = this.vm.$options.components[id]
     _.assertAsset(Ctor, 'component', id)
     _.assertAsset(Ctor, 'component', id)

+ 20 - 0
test/unit/specs/directives/repeat_spec.js

@@ -171,6 +171,26 @@ if (_.inBrowser) {
         }
         }
       })
       })
       expect(el.innerHTML).toBe('<div>AAA</div><div>BBB</div><div>CCC</div><!--v-repeat-->')
       expect(el.innerHTML).toBe('<div>AAA</div><div>BBB</div><div>CCC</div><!--v-repeat-->')
+      // #458 meta properties
+      var vm = new Vue({
+        el: el,
+        template: '<div v-repeat="list" v-component="view-{{$value}}"></div>',
+        data: {
+          list: ['a', 'b', 'c']
+        },
+        components: {
+          'view-a': {
+            template: 'AAA'
+          },
+          'view-b': {
+            template: 'BBB'
+          },
+          'view-c': {
+            template: 'CCC'
+          }
+        }
+      })
+      expect(el.innerHTML).toBe('<div>AAA</div><div>BBB</div><div>CCC</div><!--v-repeat-->')
     })
     })
 
 
     it('block repeat', function () {
     it('block repeat', function () {