Vue.js 笔记(一) 起步

版权声明:本文为博主原创文章,未经博主允许不得转载。【合作联系QQ1668681286】 https://blog.csdn.net/qq_33036361/article/details/82351108

快速入门

<!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 来返回函数值。

{{ }} --------用于输出对象属性和函数返回值。

猜你喜欢

转载自blog.csdn.net/qq_33036361/article/details/82351108