Vue v-pre Directive
Example
Using the v-pre directive to prevent compilation of a <p> element.
<img v-bind:src="imgUrl[imgIndex]">
<p v-pre>Img src: '{{ imgUrl[imgIndex] }}' <strong>(Not compiled)</strong></p>
<p>Img src: '{{ imgUrl[imgIndex] }}' <strong>(Compiled version)</strong></p>
<button v-on:click="changeImg">Change image</button>
Definition and Usage
The v-pre directive skips compilation for this element, and all of its child
elements.
The v-pre directive can be used to display raw Vue code, like curly braces
{{ }}.
Related Pages
Vue Tutorial: Vue v-bind Directive
Vue Tutorial: Vue v-on Directive
Vue Tutorial: Vue Methods
HTML Reference: HTML <pre> Tag