Vue3 v-pre 指令
Vue3 内置指令v-pre 指令用于跳过编译，不对元素及其子元素进行 Vue 模板解析。
基本说明
v-pre 指令用于告诉 Vue 跳过这个元素及其所有子元素的编译。带有 v-pre 的元素会作为原始 HTML 渲染，不进行 Vue 模板语法处理。
- 期望类型: 无（不接受表达式）
- 作用: 跳过编译，不对元素及其子元素进行 Vue 模板解析。
使用场景
1、显示原始 Mustache 标签
v-pre 最常用于显示原始的 {{ }} 语法：
实例
<template>
<div>
<p>正常渲染: {{ message }}</p>
<p v-pre>不编译显示: {{ message }}</p>
</div>
</template>
<script>
export default {
data() {
return { message: 'Hello Vue' }
}
}
</script>
<div>
<p>正常渲染: {{ message }}</p>
<p v-pre>不编译显示: {{ message }}</p>
</div>
</template>
<script>
export default {
data() {
return { message: 'Hello Vue' }
}
}
</script>
输出结果：
正常渲染: Hello Vue
不编译显示: {{ message }}