style.js
1.99 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
/* @flow */
import { cached, camelize, extend } from 'shared/util'
import { normalizeStyleBinding, getStyle } from 'web/util/style'
const cssVarRE = /^--/
const importantRE = /\s*!important$/
const setProp = (el, name, val) => {
/* istanbul ignore if */
if (cssVarRE.test(name)) {
el.style.setProperty(name, val)
} else if (importantRE.test(val)) {
el.style.setProperty(name, val.replace(importantRE, ''), 'important')
} else {
el.style[normalize(name)] = val
}
}
const prefixes = ['Webkit', 'Moz', 'ms']
let testEl
const normalize = cached(function (prop) {
testEl = testEl || document.createElement('div')
prop = camelize(prop)
if (prop !== 'filter' && (prop in testEl.style)) {
return prop
}
const upper = prop.charAt(0).toUpperCase() + prop.slice(1)
for (let i = 0; i < prefixes.length; i++) {
const prefixed = prefixes[i] + upper
if (prefixed in testEl.style) {
return prefixed
}
}
})
function updateStyle (oldVnode: VNodeWithData, vnode: VNodeWithData) {
const data = vnode.data
const oldData = oldVnode.data
if (!data.staticStyle && !data.style &&
!oldData.staticStyle && !oldData.style) {
return
}
let cur, name
const el: any = vnode.elm
const oldStaticStyle: any = oldVnode.data.staticStyle
const oldStyleBinding: any = oldVnode.data.style || {}
// if static style exists, stylebinding already merged into it when doing normalizeStyleData
const oldStyle = oldStaticStyle || oldStyleBinding
const style = normalizeStyleBinding(vnode.data.style) || {}
vnode.data.style = style.__ob__ ? extend({}, style) : style
const newStyle = getStyle(vnode, true)
for (name in oldStyle) {
if (newStyle[name] == null) {
setProp(el, name, '')
}
}
for (name in newStyle) {
cur = newStyle[name]
if (cur !== oldStyle[name]) {
// ie9 setting to null has no effect, must use empty string
setProp(el, name, cur == null ? '' : cur)
}
}
}
export default {
create: updateStyle,
update: updateStyle
}