【学习笔记】02-v-once的学习和使用

原创于 2020-09-17 10:28:53 发布 · 159 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue

Vue 专栏收录该内容

20 篇文章

订阅专栏

本文介绍Vue框架中v-once指令的使用方法及特点。v-once用于标记只渲染一次的数据，之后即使数据发生变化也不会再次更新DOM。示例展示了如何在Vue实例中应用v-once，并通过更改数据验证其效果。

v-once的认识和使用

     显示一次，无法进行二次响应，使用v-once

示例：

<div id="app">
<h1>{{messages}}</h1>
<h1 v-once>{{messages}}</h1>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
  const apt = new Vue({
    el : "#app",
    data :{
	messages : "hello word",
	}
  })
</script>

显示结果：

在这里插入图片描述
浏览器console改变messages的值，v-once的值是无法被更改的