Vue.js 筆記(一) 起步
阿新 • • 發佈:2018-11-03
快速入門
<!DOCTYPE html> <html lang="zh" dir="ltr"> <head> <meta charset="utf-8"> <title>vue test </title> <script src="https://cdn.bootcss.com/vue/2.4.2/vue.min.js" charset="utf-8"></script> </head> <body> <div id="v1"> {{msg}} <button @click="sayhi">sayhi</button> </div> </body> </html> <script type="text/javascript"> let vm=new Vue({ el:"#v1", data:{msg:"hello vue!"}, methods:{ sayhi:function(){ alert(this.msg); } } }); </script>
說明:
el --------引數是 DOM 的id
data --------用於定義屬性,例項中有三個屬性分別為:site、url、alexa。
methods --------用於定義的函式,可以通過 return 來返回函式值。
{{ }} --------用於輸出物件屬性和函式返回值。