vue 全家桶
Vue有著名的全家桶系列，包含了：
vue-router，vuex，vue-resourc。再加上构建工具vue-cli，sass样式,就是一个完整的vue项目的核心构成。
概括起来就是：、
1.项目构建工具
2.路由、
3.状态管理、
4.http请求工具。
一、Vue-cli是快速构建这个单页应用的脚手架,
# 全局安装 vue-cli
npm install --global vue-cli（国际版）
cnpm install --global vue-cli(国内版)
创建一个基于 webpack 模板的新项目
vue init webpack my-project（构建项目）
安装依赖，
cd my-project（cd 到项目）
npm install （下载依赖）
cnpm instal
pm run dev（进入项目）
二、vue-router
安装：npm installvue-router
如果在一个模块化工程中使用它，必须要通过?Vue.use()?明确地安装路由功能：
（import），（Vue），（from'vue'），（import），（VueRouter），（from'vue-router'）， ·Vue.use(VueRouter)
在使用中，可以利用vue的过渡属性来渲染出切换页面的效果。
三、vuex
vuex是专门为vue.js应用程序开发的状态管理全局的数据管理。vuex主要分五部分组成：1，state ,2，action,3，mutation,4，getters,5，mudle组成。
下载方式：npm install vuex --save
vuex使用上组件中可以直接调用上面四个mudle除外，
1、state
类似vue 对象的data, 用来存放数据以及状态。存放的数据为响应式，如果数据改变，那么依赖数据的组件也会发生相应的改变。
获取state简单的例子：
1.store.getters['getRateUserInfo']
注意：可以通过mapState把全局的state和getters映射到当前组件的computed计算属性中。
2、actions
Action 通过?store.dispatch?方法触发：action支持异步调用（可以调用api），mutation只支持操作同步，并且action提交的是 mutation，而不是直接变更状态。
例如：
const store = new Vuex.Store({
? state: {
??? count: 0
? },
? mutations: {
??? increment (state) {
????? state.count++
??? }
? },
? actions: {
??? increment (context) {
????? context.commit('increment')
??? }
? }
})
Action 函数接受一个与 store 实例具有相同方法和属性的 context 对象，因此你可以调用?context.commit?提交一个 mutation，或者通过?context.state?和?context.getters?来获取 state 和 getters。
四、axios
axios是一个http请求包，vue官网推荐使用axios进行http调用。
安装：npm install axios --save
cnpm install axios --save
例子：
1.发送一个GET请求
//通过给定的 ID 来发送请求
axios.get('/user?ID=12345')? .then(function(response){
console.log(response);
? })
? .catch(function(err){
??? console.log(err);
? });
//
以上请求也可以通过这种方式来发送
axios.get('/user',{
? params:{
??? ID:12345
? }
})
.then(function(response){
? console.log(response);
})
.catch(function(err){
? console.log(err);
});
2
、
发送一个POST请求
axios.post('/user',{
? firstName:'Fred',
? lastName:'Flintstone'
})
.then(function(res){
? console.log(res);
})
.catch(function(err){
? console.log(err);
});
