support array of objects in style binding (close #1242)

Author: yyx990803

src/directives/style.js

@@ -14,10 +14,12 @@ module.exports = {
     if (this.arg) {
       this.setProp(this.arg, value)
     } else {
-      if (typeof value === 'object') {
-        this.objectHandler(value)
-      } else {
+      if (typeof value === 'string') {
         this.el.style.cssText = value
+      } else if (_.isArray(value)) {
+        this.objectHandler(value.reduce(_.extend, {}))
+      } else {
+        this.objectHandler(value)
       }
     }
   },
@@ -59,7 +61,6 @@ module.exports = {
       this.el.style.removeProperty(prop)
     }
   }
-
 }
 
 /**

test/unit/specs/directives/style_spec.js

@@ -83,6 +83,18 @@ if (_.inBrowser) {
       expect(el.style.getPropertyValue('padding')).toBeFalsy()
     })
 
+    it('update with array of objects', function () {
+      el.style.padding = '10px'
+      dir.update([{color: 'red'}, {marginRight: '30px'}])
+      expect(el.style.getPropertyValue('color')).toBe('red')
+      expect(el.style.getPropertyValue('margin-right')).toBe('30px')
+      expect(el.style.getPropertyValue('padding')).toBe('10px')
+      dir.update([{color: 'blue'}, {padding: null}])
+      expect(el.style.getPropertyValue('color')).toBe('blue')
+      expect(el.style.getPropertyValue('margin-right')).toBeFalsy()
+      expect(el.style.getPropertyValue('padding')).toBeFalsy()
+    })
+
     it('update with object and auto prefix', function () {
       var prop = checkPrefixedProp('transform')
       var val = 'scale(0.5)'