概念

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>