1. Vue中操作數(shù)組

1. 在Vue中仰坦，修改數(shù)組中的某一項履植，請務必要用如下方法：

   push()、pop()悄晃、shift()玫霎、unshift()、splice()妈橄、sort()庶近、reverse()

2. Vue在底層包裹了數(shù)組的7個變更方法，本質就是做了兩件事：

    ① 調用原生對應的方法對數(shù)組進行更新眷蚓。
   
    ② 更新頁面鼻种。
   

2. 生命周期

2.1 何為生命周期

1. 生命周期數(shù)，又稱：生命周期函數(shù)沙热、生命周期鉤子叉钥。
2. 是什么? —— Vue在關鍵時刻幫我們調用的一些特殊名稱的函數(shù)罢缸。

2.2 生命周期圖

生命周期

1. 生命周期函數(shù)的名字不可更改，但其中的具體內容投队，看具體需求枫疆。
2. 生命周期函數(shù)中的this指向是vm或 組件實例對象。

2.3 常用的鉤子

2. mounted: 發(fā)送ajax請求敷鸦、啟動定時器息楔、綁定自定義事件、訂閱消息等【初始化操作】
3. beforeDestroy: 清除定時器扒披、解綁自定義事件值依、取消訂閱消息等【收尾工作】。

3. 組件化

3.1 對組件的理解

概念：應用中局部功能代碼和資源的集合碟案。

組件

3.2 準備一個效果

展示：學校愿险、人員 相關信息。

3.3 組件的基本使用

Vue中使用組件的三大步驟：

• 第一步：創(chuàng)建組件

  1. 如何創(chuàng)建組件蟆淀？—— 使用Vue.extend(options)方法拯啦。
  2. 其中的options和new Vue(options)幾乎一樣，但也有點小區(qū)別熔任，區(qū)別如下：
     • 組件配置中不能寫el褒链，為什么乏屯？—— 由vm去決定服務哪個容器吟逝，組件跟著走就ok了。
     • 組件配置中data必須寫成函數(shù)蓝牲，為什么惦费？ —— 避免組件復用時產(chǎn)生數(shù)據(jù)的干擾兵迅。

• 第二步：注冊組件

  new Vue({...})時，使用components配置薪贫。

• 第三步：使用組件（編寫組件標簽）恍箭。

  <Person> </Person>

3.4 關于組件名

開始本章節(jié)前，先要讓容器變空瞧省，所有的結構都配置在template中扯夭。

1. 一個單詞組成：
   • 第一種寫法：(首字母小寫)：school
   • 第二種寫法：(首字母大寫)：School —— 推薦
2. 多個單詞組成：
   • 第一種寫法：kebab-case命名，例如：atguigu-school
   • 第二種寫法：CamelCase命名鞍匾，例如：AtguiguSchool ==> 不能在容器里用交洗，要在template中用。

可以使用name配置項橡淑，指定組件在開發(fā)者工具中的名字构拳。

3.5 關于組件標簽

• 第一種寫法：<組件名></組件名>

• 第二種寫法：<組件名/> ==> 不能在容器里用，要在template中用。

  直接在容器里寫單標簽置森，會有這么一個bug：該單標簽后的組件都不解析了斗埂。解決辦法如下：

  1. 給vm加上template配置項，template中可以寫連續(xù)多個的單標簽暇藏。
  2. 使用腳手架開發(fā)蜜笤。

3.6 總結_組件名 _組件標簽

通常情況下，我們不在容器中寫任何的代碼盐碱。

3.7 App組件的使用

通常使用App組件，作為所有組件的根組件沪伙。

// 創(chuàng)建一個App組件
let App = Vue.extend({
    components:{Person,School},
    template:`
        <div>
            <Person></Person>
            <hr>
            <School></School>
        </div>`
})

3.8 注冊全局組件

1. 若某個組件瓮顽，需要在很多的地方使用，可以進行全局注冊围橡。
2. 語法：Vue.component('組件名',具體的組件)

3.9 VueComponent

1. 組件的本質是一個構造函數(shù)暖混，名為：VueComponent。

2. VueComponent翁授，不是我們定義的拣播，也不是引入了vue.js就有的，而是Vue.extend()生成的收擦。

3. 我們只需要寫 <Person></Person> 或 <Person/> 贮配，Vue底層就會幫我們執(zhí)行： new VueComponent()。

   簡記：定義組件是在創(chuàng)建VueComponent塞赂，編寫組件標簽是在new VueComponent()泪勒。

4. 關于this的指向：

   1. new Vue(options)中，this指向是vm宴猾。
   2. Vue.extend(options)中：this指向是vc圆存。

   簡記：

   • 創(chuàng)建vm時，各種配置函數(shù)中的this就是vm仇哆。
   • 創(chuàng)建組件時沦辙，各種配置函數(shù)中的this就是vc。

5. 備注：vc是一個小型的vm讹剔，但與vm也有點小不同油讯，例如：vm可配置el，而vc不能配置辟拷。