自定義vue全局組件use使用(解釋vue.use()的原理)

我們在前面學習到是用別人的組件：Vue.use(VueRouter)、Vue.use(Mint)等等。

其實使用的這些都是全局組件，這里我們就來講解一下怎么樣定義一個全局組件,并解釋vue.use()的原理

而我們再用Axios做交互，則不能使用Vue.use(Axios)，因為Axios沒有install自定義一個全局Loading組件，并使用：

總結目錄：

|-components
　　|-loading
　　　　|-index.js 導出組件，并且install
　　　　|-loading.vue 定義Loading組件，這里面基本的style ,script中之前講的methods,data方法都可以使用

index.js中的代碼：

import LoadingComponent from './loading.vue'　　const Loading={　　　　install:function(Vue){ //核心部分，在我們使用Vue.use()時，自動調用的是install，而install導出的必須是的組件 　　　　Vue.component('loading',LoadingComponent);　　} };export default Loading;

 main.js中要使用：

 　　import loading from './components/loading'　　Vue.use(loading); //調用的是install里面的組件

 vuex的使用：

 官方文檔：http://vuex.vuejs.org

vuex：主要用來集中式管理組件狀態，（如組件顯示/隱藏，增加/減少）

1)啟動一個項目

2)安裝vuex：cnpm install vuex -D

 3）vuex提供了兩個非常好的方法：

mapActions():可以將所有methods里面的方法，進行打包。即對所有的事件(或我們的行為)進行管理 mapGetters：獲取所有的數據，對所有的數據進行管理

4）vuex的工作過程：

1.當用戶點擊時，會調用increment函數(即用戶有一個動作dispatch)mapActions將函數(動作dispatch)提交到actions里面，并且傳了commit這個參數(也是一個函數)

2.commit主要處理你要做什么，比如異步請求，判斷，流程控制等，commit會將這些請求、狀態提交到mutations里面

3.mutations主要用來處理狀態(數據)的變化

4.mapGetters獲取目前數據，將狀態(數據)提交到getters上面，給mutations使用，讓數據發生變化，并返回(render)，從而更新視圖

5）actions里面除了含有commit這的對象參數以外，還有另一個參數state(Vue組件中展示的數據源)。在這個過程中可以對數據進行判斷，并作出相應的操作。

例子在src1/store.js中，這里是沒有改寫之前的代碼

官方的文檔中指出，vuex工作的各個過程是拆分開來實現的，下面我們就來進行一些分文件實現

項目的目錄：

|--src文件夾
 　　|--App.vue
　　|--main.js
　　|--store文件夾
 　　　　|--index.js //必須有index.js，它是我們組裝模塊并導出 store 的地方