vue-x action document.title动态变化通过router.afterEach动态掉action

    import Vue from 'vue'
    import Vuex from 'vuex'

    Vue.use(Vuex)

    export default new Vuex.Store({
        state: {
            shopCart:'',
            mallId:"",
            phone:'',
            userInfo:'',
            title:"",
            order_no:'',
        },
        getters: {

        },
        mutations: {
            changeShopCart(state,shopCart){
                state.shopCart=shopCart;
            },
            saveUserInfo(state,userInfo){
                state.userInfo=userInfo;
            },
            saveMallId(state,mallId){
                state.mallId=mallId
            },
            savePhone(state,phone){
                state.phone=phone
            },
            saveItemIndex(state,itemIndex){
                state.itemIndex=itemIndex
            },
            saveMyCustomer(state,customer){
                state.customer=customer
            },
            saveMyGetCustomer(state,getCustomer){
                state.getCustomer=getCustomer
            },
            saveAddressList(state,addressList){
                state.addressList=addressList
            },
            saveSelectedItem(state,addressItem){
                state.addressItem=addressItem
            },
            // saveDefaultData(state,defaultData){
            //     state.defaultData=defaultData
            // },
            saveOrderNo(state,order_no){
                state.order_no=order_no
            }
        },
        actions: {
            changeTitle({commit}, title){
               document.title = title
            },
        }
    })

import Vue from 'vue'
import VueRouter from 'vue-router'
import Store from '../store'

Vue.use(VueRouter)

const routes = [{
        path: '/',
        component: (resolve) => require(['../pages/mall/mall.vue'], resolve),
        meta: {
            title: '点外卖',
        }
    },
    {
        path: '/order',
        component: (resolve) => require(['../pages/order/order.vue'], resolve),
        meta: {
            title: '订单详情',
        }
    },
    {
        path: '/orderDetail',
        component: (resolve) => require(['../pages/order/detailOrderPage.vue'], resolve),
        meta: {
            title: '订单详情',
        }
    },
    {
        path: '/orderWait',
        component: (resolve) => require(['../pages/order/waitToUse.vue'], resolve),
        meta: {
            title: '待使用',
        }
    },
    {
        path: '/orderList',
        name: 'orderList',
        component: (resolve) => require(['../pages/order/orderList.vue'], resolve),
        meta: {
            title: '订单列表详情',
        }
    },
    {
        path: '/addressList',
        name: 'addressList',
        component: (resolve) => require(['../pages/address/address-list.vue'], resolve),
        meta: {
            title: '地址详情',
        }
    },
    {
        path: '/newAddress',
        component: (resolve) => require(['../pages/address/new-address.vue'], resolve),
        meta: {
            title: '新增地址',
        }
    },
    {
        path: '/personal',
        component: (resolve) => require(['../pages/personal/personalPage.vue'], resolve),
        meta: {
            title: '个人中心',
        }
    },
    {
        path: '/binding',
        component: (resolve) => require(['../pages/binding/binding.vue'], resolve),
        meta: {
            title: '账户绑定',
        }
    },
    {
        path: '/accountManage',
        component: (resolve) => require(['../pages/binding/accountManage.vue'], resolve),
        meta: {
            title: '账户管理',
        }
    },
    {
        path: '/newAccount',
        component: (resolve) => require(['../pages/binding/newAccount.vue'], resolve),
        meta: {
            title: '设置新手机号',
        }
    },
]

// 路由配置
const router = new VueRouter({
    routes
})

// router.beforeEach((to, from, next) => {
//     next()
// })
//
router.afterEach((to) => {
    Store.dispatch('changeTitle', to.meta.title)
})

export default router