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 }}
その他の拡張