概念
v-once是vue中的内置指令,只渲染元素和组件一次,随后的重新渲染,元素/组件及其所有的子节点都视为静态内容(其实就是缓存数据)跳过更新,这可以用于优化性能
使用场景
单个元素
<span v-once>单元素</span>
有子元素
<div v-once>
<h1>子元素</h1>
</div>
组件
<my-com v-once></my-com>
v-for
//实际上v-once渲染到外层的ul
<ul>
<li v-for="item in list" v-once></li>
</ul>
vue3.2之后增加了v-memo指令
<div v-memo="[valueA,valueB]">
<div v-for="item in list " :key="item.id">{{item}}</div>
</div>