Vue.js 的 props 更新由父组件重渲染驱动，触发子组件重新执行 render 生成新 VNode，再经 patch 算法比对更新 DOM；props 本身不被直接 diff，仅作为渲染输入，且为只读响应式代理。
Vue.js 的补丁算法（Patch）在更新阶段对 props 的处理，并不直接由核心 diff 算法（如 patchVNode）负责“对比并更新 props”，而是通过组件实例的响应式系统与生命周期协作完成的。Props 的变更本质上是父组件向子组件传递的新数据，其更新流程有明确分工：
Props 变更触发的是子组件的重新渲染，而非直接 patch 属性对象
当父组件 re-render 导致传入子组件的 props 值变化时，Vue 会：
- 将新 props 作为参数调用子组件的
updateComponent（或render函数），生成新的子树 VNode； - 随后进入标准 patch 流程：用新旧 VNode 进行 diff，逐层比对节点、子节点、指令、事件等；
- props 本身不会被单独 diff 或 patch，它只是渲染函数的输入——真正被 patch 的是基于新 props 渲染出的 VNode 结构。
子组件内部对 props 的访问是响应式的，但不可直接修改
在 setup() 或 data 中定义的 props 是只读代理（Proxy with get/set 拦截）：
- 读取 props[key] 触发 getter，可正常响应依赖收集；
- 尝试赋值（如
props.count = 2）会触发 warning（开发模式）且静默失败（生产模式）； - 若需派生状态，应使用
computed(() => props.xxx)或toRefs(props)解构（仅限响应式解构，非赋值）。
Props 更新可能触发子组件的 beforeUpdate / updated 钩子
只要子组件因 props 变化而重渲染，就会走完整更新周期：
-
beforeUpdate：在 patch 开始前执行，此时 this.$props 已是新值，但 DOM 尚未更新； -
updated：在 patch 完成、DOM 更新后执行，适合操作真实 DOM； - 注意：如果子组件是
functional（已废弃）或shallowRef包裹且未触发响应，可能跳过更新。
深层响应式 props（如对象/数组）需谨慎监听
默认情况下，props 是浅响应式（shallow）：
- 修改
props.obj.name不会触发子组件更新（除非该属性本身被watch或computed显式追踪）； - 若需深度响应，应在子组件中用
watch(() => props.obj, …, { deep: true })； - 或使用
toRefs+computed将嵌套字段转为独立响应式引用。
不复杂但容易忽略：props 的“更新”本质是父组件驱动的子组件重渲染，Patch 算法只作用于 VNode 树，不直接操作 props 对象本身。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
