テンプレート記述を無効化するv-pre

date

Mar 6, 2023

repo_url

slug

vhtml-pre

status

Published

summary

type

Post

thumbnail_url

tags

vue

outer_link

v-preディレクティブは、マスタッシュ構文を含め、その配下のタグ内のテンプレート記述を全て無効化してそのまま表示する。

<template>
  <section v-pre>
    <p v-on:click="showHello">{{hello!}}</p>
  </section>
</template>

↓レンダリング

<section v-pre>
  <p v-on:click="showHello">{{hello!}}</p>
</section>