12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576 |
- /* @flow */
- import { extend, isObject } from 'shared/util'
- function updateClass (oldVnode: VNodeWithData, vnode: VNodeWithData) {
- const el = vnode.elm
- const ctx = vnode.context
- const data: VNodeData = vnode.data
- const oldData: VNodeData = oldVnode.data
- if (!data.staticClass &&
- !data.class &&
- (!oldData || (!oldData.staticClass && !oldData.class))
- ) {
- return
- }
- const oldClassList = makeClassList(oldData)
- const classList = makeClassList(data)
- if (typeof el.setClassList === 'function') {
- el.setClassList(classList)
- } else {
- const style = getStyle(oldClassList, classList, ctx)
- if (typeof el.setStyles === 'function') {
- el.setStyles(style)
- } else {
- for (const key in style) {
- el.setStyle(key, style[key])
- }
- }
- }
- }
- function makeClassList (data: VNodeData): Array<string> {
- const classList = []
- // unlike web, weex vnode staticClass is an Array
- const staticClass: any = data.staticClass
- const dataClass = data.class
- if (staticClass) {
- classList.push.apply(classList, staticClass)
- }
- if (Array.isArray(dataClass)) {
- classList.push.apply(classList, dataClass)
- } else if (isObject(dataClass)) {
- classList.push.apply(classList, Object.keys(dataClass).filter(className => dataClass[className]))
- } else if (typeof dataClass === 'string') {
- classList.push.apply(classList, dataClass.trim().split(/\s+/))
- }
- return classList
- }
- function getStyle (oldClassList: Array<string>, classList: Array<string>, ctx: Component): Object {
- // style is a weex-only injected object
- // compiled from <style> tags in weex files
- const stylesheet: any = ctx.$options.style || {}
- const result = {}
- classList.forEach(name => {
- const style = stylesheet[name]
- extend(result, style)
- })
- oldClassList.forEach(name => {
- const style = stylesheet[name]
- for (const key in style) {
- if (!result.hasOwnProperty(key)) {
- result[key] = ''
- }
- }
- })
- return result
- }
- export default {
- create: updateClass,
- update: updateClass
- }
|