vue 基础代码

vue的最开始使用

1. 引入vue包 需要在body之前引入

2. 在html写一个带id的标签 这个父级元素及它内部所有元素都在下一步的控制域内

   <div id="ctr-01">
            <p >{{first}}</p>
   </div>
   

   3. new 一个Vue对象

      var vm = new Vue({
                el:'#ctr-01',
                data:{
                    first:'vue是什么?'
                }
            })
      

      (1)其中 el 是选择器 注意 el只能选择一个dom作为控制域 比如：

      <div id="ctr-01">
                <p >{{first}}</p>
      </div>
      <div id="ctr-01">
                <p >{{first}}</p>
      </div>
      

      结果：

      //vue是什么?

      {{first}}

      //

      可以看出 用类选择器时 vue只选择class中第一个dom

      (2) 使用data内部的数据时候，如：this.first的方式 但是不可以 this.data.first 我们打印vm 看看为什么

      
      
      1559898964602.png

我们看到first 成为vm中的一个属性 再试试打印 vm. _data.first 看看

1559899097141.png

答案是可行的。

这是高程中对代码的解释

1559899419823.png

(3) 引用传入数据 在标签内部加入名为“插值表达式” 如 {{first}}