vue元件的定義
● 元件(component)是vue.js最強大的功能之一
● 元件可以擴充套件html元素，封裝可重用**
● 在較高層面上，元件是自定義元素，vue.js的編譯器為他新增特殊功能
● 有些情況下，元件也可以表現用 is 特性進行了擴充套件的原生的html元素
● 所有的vue元件同時也都是vue例項，所以可以接受相同的選項物件（除了一些根級特有的選項），並提供相同的生命週期鉤子
vue元件的功能
1）能夠把頁面抽象成多個相對獨立的模組
2）實現**重用，提高開發效率和**質量，使得**易於維護
vue元件封裝過程
● 首先，使用vue.extend()建立乙個元件
● 然後，使用vue.component()方法註冊元件
● 接著，如果子元件需要資料，可以在props中接受定義
● 最後，子元件修改好資料之後，想把資料傳遞給父元件，可以使用emit()方法
元件使用流程詳細介紹
1、元件建立---有3中方法，extend()
2、註冊元件----有2中方法，全域性註冊，區域性註冊
a1、全域性註冊：一次註冊( 呼叫vue.component( 元件名稱，為元件建立時定義的變數 ) )，可在多個vue例項中使用。
我們先用全域性註冊，註冊上面例子中建立的mycom元件
vue.component('my-com',mycom)
a2、全域性註冊語法糖：不需要建立直接註冊的寫法
vue.component('my-com',)
'my-com'為給元件自定義的名字，在使用時會用到，後面mycom對應的就是上面構建的元件變數。
a3、如果是用template及script標籤構建的元件，第二個引數就改為它們標籤上的id值
vue.component('my-com',)
b1、區域性註冊：只能在註冊該元件的例項中使用，一處註冊，一處使用
只需要在呼叫元件的地方，寫上元件名字的標籤即可
/*呼叫元件*/
4、例子
c、template 和script標籤建立元件
這是template標籤構建的元件
5、非同步元件
vue作為乙個輕量級前端框架，其核心就是元件化開發。我們一般常用的是用腳手架vue-cli來進行開發和管理，乙個個元件即為乙個個vue頁面，這種叫單檔案元件。我們在引用元件之時只需將元件頁面引入，再註冊即可使用。
當專案比較大型，結構比較複雜時，我們一般選用vue-cli腳手架去構建專案。因為vue-cli整合了webpack環境，使用單檔案元件，開發更簡單，易上手，尤其是在對元件的處理上。對於原生vue.js，我們就得將元件構建在同乙個html的script標籤下或者html的外部js中，所有元件集中在一塊，不容易管理，這也是原生vue,js的一點不便之處
vue.js可以將非同步元件定義為乙個工廠函式。
使用$.get獲取本地檔案會跨域，所以要將專案部署到伺服器中
顯示效果如下：
6、vue中的props資料流
通過在註冊元件中申明需要使用的props，然後通過props中與模板中傳入的對應的屬性名，去取用這些值
注意：a、props取值的方式
在註冊元件的模板內部template，直接通過prop的名稱取值就ok
template: '我叫：}, 我來自：}
'不在註冊元件的模板內部template，用this.prop的方式
console.log('我來自：', this.comefrom)
b、在template選項屬性中，可以寫駝峰命名法，也可以寫短橫線命名法
在html(模板)中，只能寫短橫線命名法
原因：vue元件的模板可以放在兩個地方
a、vue元件的template選項屬性中，作為模板字串
b、放在.html中[ 用script template標籤建立的元件 ]，作為html
問題在於html不區分大小寫，所以在vue註冊元件中通用的駝峰命名法，不適用於html中的vue模板，在html中寫入props屬性，必須寫短橫線命名法（把原來props屬性中的每個prop大寫換成小寫，並且在前面加「-」）
將6中的
改成顯示效果，第二個沒有顯示
非同步元件的實現原理；非同步元件的3種實現方式---工廠函式、promise、高階函式
非同步元件實現的本質是2次渲染，先渲染成注釋節點，當元件載入成功後，在通過forcerender重新渲染
高階非同步元件可以通過簡單的配置實現loading resolve reject timeout 4種狀態
VUE元件傳遞引數
誰用誰，誰就是父元件 全域性元件和區域性元件名字衝突時 區域性元件會把全域性元件頂替掉 父頁面向子元件 ul com 通過屬性名 list 傳遞了乙個陣列資料 1,2,3,4 子元件通過 props 進行接收資料 props 資料的 父傳子 在父元件使用子元件的時候 在子元件的行內標籤新增屬性 在子...
vue父子元件傳遞引數
父元件 展示如下 子元件 展示如下 向父元件傳值 以上 展示即可實現父子元件的資料傳遞。有一種場景 父元件需要在頁面初始化時請求介面獲取資料，此時父元件中引入了子元件，需向子元件傳遞資料，而此時父元件還並沒有完成請求，因此傳遞給子元件的資料為空。解決方法如下 1 在子元件中使用watch監聽 wat...
vue 元件的封裝
首先封裝元件的需求肯定是多個地方要用到同乙個東西，他們都有公共的地方，vue的封裝 簡單來說就是將公共引數封裝起來 然後在需要的地方引入 子元件封裝 background background align right current change currentchange size change ...