1// js code
2const appFunction = Vue.createApp({
3 data(){
4 return{
5
6 globalFun1:'hello fun 1',
7 globalFun2:'<h2>hello fun 2</h2>',
8 textFun:''
9 }
10 }
11 ,
12 methods:{
13 randFun(){
14 const rand = Math.random();
15 if (rand <= 0.5){
16 alert(this.globalFun1)
17 }else{
18 alert(this.globalFun2);
19 }
20 }
21
22 }
23})
24
25appFunction.mount('#testfunction');
26
27
28
29//html code
30 <div id='testfunction' class="bg-dark">
31 <span v-html="globalFun2">
32
33 </span>
34<button v-on:click='randFun'>refresh</button>
35 </div>
1return 'Hello <em>World</em>! My name is <my-name :name="$parent.name">
2</my-name>!';
3
4Usage will be:
5<p v-markup="markup"></p>
6
7When rendered, the above will be identical to doing this:
8<p>
9 Hello <em>World</em>! My name is <my-name :name="name"></my-name>!
10</p>