从一次线上事故聊 Vue 的 nextTick 与 DOM 更新时机
线上有个基于 Vue 3 的弹窗组件,需要在打开后自动聚焦到里面的输入框。代码看起来没什么问题:点击按钮把 visible 设为 true,然后立刻调用 inputRef.value.focus()。本地开发一切正常,但上线后偶发聚焦失败,控制台报 Cannot read properties of null (reading 'focus')。排查后发现,问题出在 visible 变化到 DOM 真正更新之间存在异步间隙,而 inputRef 在那个时刻还是 null。这类问题在弹窗、表格滚动、图表初始化、动态表单校验里反复出现,根源都是对 Vue 响应式更新和 DOM 更新时机理解不够。本...