响应式数据

Vue 3的组合式API中，ref()和reactive()是创建响应式数据的核心工具。ref()可包裹任意值类型，通过.value访问，模板中自动解包；reactive()仅支持对象/数组，直接访问属性，但替换整个对象会丢失响应式。ref()更灵活，推荐优先使用，避免reactive()的解构和替换陷阱。toRefs()可将reactive()对象的属性转 …

Vue 3中的侦听器（watch）用于响应式跟踪数据源变化，允许在数据改变时执行自定义副作用。通过ref或reactive创建响应式数据，watch可以监听单个或多个数据源的变化，并通过回调函数处理新旧值。高级选项如deep和immediate支持深度监听和立即执行。watchEffect则自动跟踪依赖，适合无需旧值的场景。侦听器常用于网络请求、表单验证等场 …

Vue3的模板语法基于HTML，允许通过插值和指令将响应式数据与DOM绑定，实现数据变化时页面自动更新。核心流程包括模板解析为AST，编译为渲染函数，生成虚拟DOM并更新真实DOM。文本插值使用{{ }}，支持简单表达式，自动转义HTML；v-html指令可渲染原始HTML，但存在XSS风险。v-bind用于动态绑定HTML属性，缩写为:，支持动态属性名和对 …