v-once指令如何实现数据绑定的一次性渲染

v-once是Vue中的一个指令，它的作用是缓存元素或组件的渲染结果，以便在后续的更新中跳过它们的渲染过程。这可以大大提高渲染性能，尤其是在数据不经常更改的情况下。

具体实现代码如下：

<template>
  <li v-if="!deleted" v-once>
    {{ user.name }}
    <button @click="onDelete">删除</button>
  </li>
</template>
 
<script>
export default {
  props: ['user'],
  data() {
    return {
      deleted: false
    };
  },
  methods: {
    onDelete() {
      this.deleted = true;
    }
  }
};

</script>