Bladeren bron

Remove identifier sync back in v-repeat

The auto-sync back when an identifier is used causes issues
such as #213 and #234, while the feature is a rarely used
edge case that is also a bit magical. It can be easily circumvented
by using object arrays instead of primitive ones, and the sync-back
is better left in userland for those who really need it.

For reference, Angular also doesn't support sync back for primitive values.
Evan You 12 jaren geleden
bovenliggende
commit
b50e5a5963

+ 0 - 10
src/directives/repeat.js

@@ -212,16 +212,6 @@ module.exports = {
             (raw || data).__emitter__[this.identifier] = true
         }
 
-        if (wrap) {
-            var self = this,
-                sync = function (val) {
-                    self.lock = true
-                    self.collection.$set(vm.$index, val)
-                    self.lock = false
-                }
-            vm.$compiler.observer.on('change:' + alias, sync)
-        }
-
         return vm
 
     },

+ 0 - 15
test/functional/fixtures/repeated-primitive.html

@@ -1,15 +0,0 @@
-<div id="test">
-    <p v-repeat="numbers" v-on="click: $value+=' modified'">{{$value}}</p>
-</div>
-
-<script src="../../../dist/vue.js"></script>
-<script>
-    Vue.config('debug', true)
-    var numbers = [1, 2, 'text']
-    var test = new Vue({
-        el: '#test',
-        data: {
-            numbers: numbers
-        }
-    })
-</script>

+ 0 - 37
test/functional/specs/repeated-primitive.js

@@ -1,37 +0,0 @@
-/* global numbers */
-
-casper.test.begin('Repeated Primitives', 8, function (test) {
-    
-    casper
-    .start('./fixtures/repeated-primitive.html')
-    .then(function () {
-
-        test.assertSelectorHasText('p:nth-child(1)', '1')
-        test.assertSelectorHasText('p:nth-child(2)', '2')
-        test.assertSelectorHasText('p:nth-child(3)', 'text')
-
-    })
-    // click everything to test event handlers (delegated)
-    .thenClick('p:nth-child(1)', function () {
-        test.assertSelectorHasText('p:nth-child(1)', '1 modified')
-    })
-    .thenClick('p:nth-child(2)', function () {
-        test.assertSelectorHasText('p:nth-child(2)', '2 modified')
-    })
-    .thenClick('p:nth-child(3)', function () {
-        test.assertSelectorHasText('p:nth-child(3)', 'text modified')
-    })
-    // more clicks
-    .thenClick('p:nth-child(1)', function () {
-        test.assertSelectorHasText('p:nth-child(1)', '1 modified modified')
-    })
-    .then(function () {
-        test.assertEvalEquals(function () {
-            return numbers
-        }, ['1 modified modified', '2 modified', 'text modified'])
-    })
-    .run(function () {
-        test.done()
-    })
-
-})

+ 6 - 33
test/unit/specs/directives.js

@@ -852,18 +852,12 @@ describe('Directives', function () {
             }
         })
 
-        it('should work with primitive values', function (done) {
-            var triggeredChange = 0
+        it('should work with primitive values', function () {
             var v = new Vue({
-                template: '<span v-repeat="tags" v-ref="tags">{{$value}}</span>',
+                template: '<span v-repeat="tags">{{$value}}</span>',
                 data: {
                     tags: ['a', 'b', 'c']
                 },
-                created: function () {
-                    this.$watch('tags', function () {
-                        triggeredChange++
-                    })
-                },
                 computed: {
                     concat: function () {
                         return this.tags.join(',')
@@ -872,13 +866,6 @@ describe('Directives', function () {
             })
             assert.strictEqual(v.concat, 'a,b,c')
             assert.strictEqual(v.$el.textContent, 'abc')
-            v.$.tags[0].$value = 'd'
-            assert.strictEqual(v.tags[0], 'd')
-            nextTick(function () {
-                assert.strictEqual(triggeredChange, 1)
-                assert.strictEqual(v.concat, 'd,b,c')
-                done()
-            })
         })
 
         it('should diff and reuse existing VMs when reseting arrays', function (done) {
@@ -955,41 +942,27 @@ describe('Directives', function () {
            
         })
 
-        it('should accept arg for aliasing on primitive arrays', function (done) {
+        it('should accept arg for aliasing on primitive arrays', function () {
             
             var v = new Vue({
-                template: '<span v-repeat="item:items" v-ref="items">{{item}}</span>',
+                template: '<span v-repeat="item:items" >{{item}}</span>',
                 data: {
                     items: [1,2,3]
                 }
             })
             assert.strictEqual(v.$el.textContent, '123')
-            v.$.items[0].item = 2
-
-            nextTick(function () {
-                assert.strictEqual(v.$el.textContent, '223')
-                assert.deepEqual(v.items, [2,2,3])
-                done()
-            })
 
         })
 
-        it('should accept arg for aliasing on object arrays', function (done) {
+        it('should accept arg for aliasing on object arrays', function () {
             
             var v = new Vue({
-                template: '<span v-repeat="item:items" v-ref="items">{{item.id}}</span>',
+                template: '<span v-repeat="item:items">{{item.id}}</span>',
                 data: {
                     items: [{id:1},{id:2},{id:3}]
                 }
             })
             assert.strictEqual(v.$el.textContent, '123')
-            v.$.items[0].item = { id: 2 }
-
-            nextTick(function () {
-                assert.strictEqual(v.$el.textContent, '223')
-                assert.strictEqual(v.items[0].id, 2)
-                done()
-            })
 
         })