Vue學習(三)——屬性繫結和雙向資料繫結
阿新 • • 發佈:2018-11-26
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>屬性繫結和雙向資料繫結</title> <script src="./vue.js"></script> </head> <body> <div id="root"> <!--屬性繫結:v-bind:title資料繫結 雙引號中的內容為一個js表示式 可以將v-bind省略掉--> <div :title="'success yourself '+title">hello world</div> <!-- v-model:資料雙向繫結 --> <input v-model="content"/> <div>{{content}}</div> </div> <script> new Vue({ el:"#root", data:{ title:'this is a hello world', content:'this is a content' } }) </script> </body> </html>
注:學習筆記內容來自:https://www.imooc.com/learn/980
官網:cn.vuejs.org