1.官網：cn.vuejs.org
    Stript標籤引入要在head裡面

2.掛載點，模板，例項之間關係
    <div id="root">   </div>   -- >掛載點,掛載點之內的內容，是模板
    <script>
     new Vue({
           el:"#root",
           template:'<h1>hello</h1>',    模板可以放在例項裡
           data:{
          msg:"world"

          }
       })
    </script>

3.Vue例項中的資料，事件和方法
      <h1>{{number}}<h1/>   插值表示式
      <h1 v-text="contect"><h1/>
      <div v-html="contect">   </div>二者差別在於，v-text能轉義，將標籤以字串方式展現

繫結事件：  <div  v-on：click=“handleClick”>   </div>
                     handleClick定義在Vue例項的methods裡
                    

事件繫結簡寫：v-on:   可替換成  @

4.Vue中的屬性繫結和雙向資料繫結

5.Vue中的計算屬性和偵聽器

 compute:一個屬性由其他屬性計算而來。其他屬性沒改變，該屬性用的是快取值

偵聽器：
<div>{{count}}</div>
data：{
    count:0
}
watch:{
   firstName:function(){
           this.count++           只要firstName的值發生變化，count+1
    }
}

6.v-if,v-show,v-for指令
v-if   當他對應的資料項的值是false時，會直接將該標籤清除，
v-show   當他對應的資料項的值為false時，將該標籤增加display:none 屬性
隱藏顯示頻繁時用v-show效能更好

v-for：
<ul>
        <li  v-for="item of list"  :key="item">{{item}}</li>   使用key提升渲染效率，但要求key值都不同，若item值相同，

                                                                                           可以用index做key值  v-for="（item ，index）of list"
</ul>
data{list:[1,2,3]}

7.元件的拆分及全域性元件，區域性元件

全域性元件↑

區域性元件↑

元件的拆分↑
props屬性：意為該元件接收從外部傳過來的名為content的屬性

8.元件與例項的關係

   每一個vue的元件就是一個vue例項，每一個元件也可以寫method等屬性

當小元件被點選時，觸發了handelClick方法 ，該方法向外觸發一個事件，事件名為delete，事件對應的值為index；由於父元件在建立子元件時，有一個監聽事件，當監聽到delete方法被觸發時，就會執行handelDelete方法，該方法定義在父元件的模板裡，為父元件的方法

將list中對應的index下標的值刪掉。一旦list發生變化，todo-item會將對應的該元件從列表刪掉

總結一下大概的邏輯過程：
（1）：父元件通過prop向子元件傳值 子元件獲得父元件傳來的內容和索引。
（2）：子元件通過$emit向父元件丟擲觸發事件名稱（delete）和觸發事件的list索引值。
（3）：父元件通過監聽對應事件名稱（@delete）觸發函式handleDelete。函式通過子元件丟擲的索引值對應刪除list

vue-cli相關用法：
1.template中只能有有個標籤包裹其他所有標籤
2.data  不再是一個物件而是一個函式，返回值為對應資料