Vue學習（二）——內容顯示和繫結事件
阿新 • • 發佈：2018-11-26
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Vue入門</title> <script src="./vue.js"></script> </head> <body> <div id="root"> <!-- 插值表示式：{{number}} --> <!-- v-text顯示文字內容 --> <!-- v-html可以自動轉義處理顯示dom節點中的內容 --> <!-- v-on:click 繫結事件,其實是監聽 簡寫為@click --> <h1 v-text="msg" @click="handleClick"></h1> <h1 v-html="content"></h1> </div> <script> new Vue({ el:"#root", data:{ msg:"Hello World", msg2:'Hello Wanglu', msg3:'', content:'<span>123</span>' }, methods:{ handleClick:function(){ this.msg3=this.msg; this.msg=this.msg2; //改變的是Vue例項中的資料 this.msg2=this.msg3; } } }) </script> </body> </html>
注：學習筆記內容來自：https://www.imooc.com/learn/980
官網：cn.vuejs.org