vue render html raw
<p>Using mustaches: {{ rawHtml }}</p>
<p>Using v-html directive: <span v-html="rawHtml"></span></p>vue render html raw
<p>Using mustaches: {{ rawHtml }}</p>
<p>Using v-html directive: <span v-html="rawHtml"></span></p>v-bind Shorthand
<!-- full syntax -->
<a v-bind:href="url"> ... </a>
<!-- shorthand -->
<a :href="url"> ... </a>
<!-- shorthand with dynamic argument (2.6.0+) -->
<a :[key]="url"> ... </a>vue does v-html inject html
return 'Hello <em>World</em>! My name is <my-name :name="$parent.name">
</my-name>!';
Usage will be:
<p v-markup="markup"></p>
When rendered, the above will be identical to doing this:
<p>
Hello <em>World</em>! My name is <my-name :name="name"></my-name>!
</p>v-html vue js
// js code
const appFunction = Vue.createApp({
data(){
return{
globalFun1:'hello fun 1',
globalFun2:'<h2>hello fun 2</h2>',
textFun:''
}
}
,
methods:{
randFun(){
const rand = Math.random();
if (rand <= 0.5){
alert(this.globalFun1)
}else{
alert(this.globalFun2);
}
}
}
})
appFunction.mount('#testfunction');
//html code
<div id='testfunction' class="bg-dark">
<span v-html="globalFun2">
</span>
<button v-on:click='randFun'>refresh</button>
</div>Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
