1.Vue单页面使用路由

　　1>跳转路由给url中添加参数：router.push({ name: 'Paymethod', query:{m:true}});

　　2>跳转后获取url中的参数：this.$route.query.m.

　　3>vuex中有四个文件：action.js----->mutations.js----->state.js----->store.js

　　步骤一：在store.js中定义好状态树

export default {    menu:null}

　　步骤二：将state、action.js、mutations.js引入到store.js

import Vue from 'vue'import Vuex from 'vuex'import actions from './actions'import mutations from './mutations'import state from './state'Vue.use(Vuex)export default new Vuex.Store({    strict: process.env.NODE_ENV !== 'production',    state,    actions,    mutations,})　

　　步骤三：action.js发送请求，获取数据提交到mutation.js

import config from '../config'import fetch from 'isomorphic-fetch'export default {    getMenu(context, orgType) {        fetch(`${config.devHost}/user/menu`, {            method: 'GET',            credentials: 'include'        })        .then(response => response.json())        .then(response => {            if(response.code === 'A00000'){                context.commit("getMenu", response.data);            }else{                context.commit("getMenu", {'msg' : 'error'});            }        })        .catch(error => {            context.commit("getMenu", {});        })    }}

　　步骤四：获取到action.js提交过来的数据,修改state.js中状态树中的state

export default {    getInfo(state, menu){        state.menu = menu;    }}

 　　4>在组件中watch和computed的配合使用：

data() {   return {       menuArr:[]  //菜单   }},beforeCreate(){    this.$store.dispatch('getMenu');},watch: {    menu:{         handler(menu){             this.menuArr=menu.menu;        },        deep: true    }},computed: {    route(){        return this.$route;    },    menu(){        return this.$store.state.menu;    }}