Vue v-pre、v-once 指令_v-pre的作用

1. v-pre指令

v-pre用来跳过当前节点的编译过程，加快编译速度。
用途如下：

	<!-- v-pre -->
    <span v-pre>{{ this will not be compiled }}</span>
    <!-- 页面直接显示以下内容 -->
    {{ this will not be compiled }}
1
2
3
4

2. v-once 指令

作用是定义它的元素或组件只会渲染一次，包括元素或者组件的所有字节点。首次渲染后，不再随着数据的改变而重新渲染。

<template>
	<div>
		<div v-once>{{title}}</div>
		<button @click="editTitle">编辑标题</button>
	</div>
</template
<script>
export default {
	data(){
		return {
			msg: "第一次渲染"
		}
	},
	methods: {
		editTitle(){
			this.msg = "第二次渲染"
		}
	}
}
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

如上即使触发 button 的 click事件，也不会改变 msg的渲染状态