基础入门

Vue3中事件处理函数传参，多用内联调用（如@click=“say(‘参数’)"）传递自定义参数。需原生事件时用$event或箭头函数（如@click=“warn(‘消息’, $event)“或(e)=>warn(‘消息’,e)），参数 …

DOM事件流分捕获、目标、冒泡三阶段，Vue默认冒泡阶段触发事件。事件修饰符改变这一行为：.stop（阻止冒泡）、.prevent（阻止默认行为）、.capture（捕获阶段触发）、.passive（优化滚动性能）、.once（只触发一次）。修饰符可串联，如.click.stop.prevent。

Vue事件处理分内联和方法处理器。内联模板写简单逻辑（如count++），需事件对象显传$event，不可复用；方法藏逻辑到函数，适合复杂/复用场景，可传参和事件对象。核心区别：逻辑位置、复杂度、复用性。场景：内联简单切换，方法复杂/复用。

Vue事件绑定支持v-on与@简写，涵盖按钮点击、输入、表单提交等常用事件。处理函数分内联（简单逻辑）和方法（复用），可传自定义参数，需用$event获取原生事件。常见错误包括函数未定义、未传$event、修饰符拼写错误。

本文介绍Vue 3列表渲染整合搜索、排序、分页的实现。通过v-model双向绑定搜索词，computed依赖缓存过滤数据；用sortKey和sortOrder管理排序状态，复制数组避免篡改原始数据实现排序；计算当前页数据切片，渲染分页列表，并处理搜索、排序、分页联动。

大规模列表用v-for渲染时，过多DOM节点致页面初始化慢、滚动卡顿等性能问题。优化方案：虚拟滚动（如vue-virtual-scroller的RecycleScroller）通过计算可视区域项数，仅渲染少量DOM（如item-size设50px，10000条数据仅渲染10条）；v-memo缓存模板片段，依赖数组参数控制是否更新，结合v-for减少重复渲染。