因为一个写法，我翻烂了 vue 源码，这是 vue的问题吧，我要不要提 pr！

<template>
  <div>
    <div class="test" :style="[is ? {backgroundColor:'red'} : '',bg]">这是测试页面</div>
  </div>
</template>
<script setup>
import { ref } from 'vue'
const is=ref(true)
const bg = ref({'background-color': 'yellow'})
setInterval(() => {
       is.value=!is.value
}, 5000);
</script>
<style>
.test{
  height: 500px;
  width: 500px;
  text-align: center;
  line-height: 500px;
  font-size: 40px;
}
</style>

<div :style="[baseStyles, overridingStyles]"></div>

export function normalizeStyle(
  value: unknown
): NormalizedStyle | string | undefined {
  // 判断样式数组的情况
  if (isArray(value)) {
    // 最后格式化之后的样式对象
    const res: NormalizedStyle = {}
    // 对当前数组进行遍历，此处就可以预示着，在初始值后方的数组内容会覆盖前方的
    for (let i = 0; i < value.length; i++) {
      // 拿到数组中的每一项
      const item = value[i]
      // 如果是个字符串，那就表示这个样式需要解析
      const normalized = isString(item)
        ? parseStringStyle(item)
        // 否则防止是个多维数组，递归调用最终将所有的都放在res中
        : (normalizeStyle(item) as NormalizedStyle)
      if (normalized) {
        for (const key in normalized) {
          res[key] = normalized[key]
        }
      }
    }
    return res
    // 其他情况暂且不看
  } else if (isString(value)) {
    return value
  } else if (isObject(value)) {
    return value
  }
}

function createBaseVNode(
  type: VNodeTypes | ClassComponent | typeof NULL_DYNAMIC_COMPONENT,// vnode类型
  props: (Data & VNodeProps) | null = null,// 属性
  children: unknown = null,// 子节点
  patchFlag = 0, // 补丁标记
  dynamicProps: string[] | null = null,
  shapeFlag = type === Fragment ? 0 : ShapeFlags.ELEMENT,
  isBlockNode = false,
  needFullChildrenNormalization = false
) {
  // 创建vnode
  const vnode = {
    __v_isVNode: true,
    __v_skip: true,
    type,
    props,// 中间包含style内容
    key: props && normalizeKey(props),
    ref: props && normalizeRef(props),
    scopeId: currentScopeId,
    slotScopeIds: null,
    children,
    component: null,
    suspense: null,
    ssContent: null,
    ssFallback: null,
    dirs: null,
    transition: null,
    el: null,
    anchor: null,
    target: null,
    targetAnchor: null,
    staticCount: 0,
    shapeFlag,
    patchFlag,
    dynamicProps,
    dynamicChildren: null,
    appContext: null,
    ctx: currentRenderingInstance
  } as VNode
  if (needFullChildrenNormalization) {
    normalizeChildren(vnode, children)
    if (__FEATURE_SUSPENSE__ && shapeFlag & ShapeFlags.SUSPENSE) {
      ; (type as typeof SuspenseImpl).normalize(vnode)
    }
  } else if (children) {
    // compiled element vnode - if children is passed, only possible types are
    // string or Array.
    vnode.shapeFlag |= isString(children)
      ? ShapeFlags.TEXT_CHILDREN
      : ShapeFlags.ARRAY_CHILDREN
  }


  if (__DEV__ && vnode.key !== vnode.key) {
    warn(`VNode created with invalid key (NaN). VNode type:`, vnode.type)
  }


  if (
    isBlockTreeEnabled > 0 &&
    !isBlockNode &&
    currentBlock &&
    (vnode.patchFlag > 0 || shapeFlag & ShapeFlags.COMPONENT) &&
    vnode.patchFlag !== PatchFlags.HYDRATE_EVENTS
  ) {
    currentBlock.push(vnode)
  }

  if (__COMPAT__) {
    convertLegacyVModelProps(vnode)
    defineLegacyVNodeProperties(vnode)
  }

  return vnode
}

export { createBaseVNode as createElementVNode }

export const patchProp: DOMRendererOptions['patchProp'] = (
  el,
  key,
  prevValue,
  nextValue,
  isSVG = false,
  prevChildren,
  parentComponent,
  parentSuspense,
  unmountChildren
) => {
    
    patchStyle(el, prevValue, nextValue)

}

export function patchStyle(el: Element, prev: Style, next: Style) {
  // 拿到style样式
  const style = (el as HTMLElement).style
  const isCssString = isString(next)
  //如果不是字符窜
  if (next && !isCssString) {
    // 遍历对象 设置style
    for (const key in next) {
      setStyle(style, key, next[key])
    }
    // 老的style删除
    if (prev && !isString(prev)) {
      for (const key in prev) {
        // 优化手段，如果新的节点没有，那么就表示需要删除，如果按照正常思维，
        //应该是先给老的全删了新的全加上
        if (next[key] == null) {
          setStyle(style, key, '')
        }
      }
    }
  } else {
    // 字符串的情况我们暂且不论
    const currentDisplay = style.display
    if (isCssString) {
      if (prev !== next) {
        style.cssText = next as string
      }
    } else if (prev) {
      el.removeAttribute('style')
    }
    if ('_vod' in el) {
      style.display = currentDisplay
    }
  }
}

//将连字符转化为转驼峰 'on-click' => 'onClick'
const camelizeRE = /-(\w)/g

const camelize = cacheStringFunction(str => {
  return str.replace(camelizeRE, (_, c) => (c ? c.toUpperCase() : ''))
})


//将小驼峰转化为连字符字符串 'onClick' => 'on-click'

onst hyphenateRE = /\B([A-Z])/g const hyphenate = cacheStringFunction((str: string) => str.replace(hyphenateRE, '-$1').toLowerCase() )

   if (normalized) {
        for (const key in normalized) {
          res[hyphenate(key)] = normalized[hyphenate(key)]
        }
      }