利用获取路由参数实现动态的更新面包屑
1、下载vuex
npm i vuex -S
2、在vue项目的src下建立包store,并创建index.js
index,js
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
const store = new Vuex.Store({
state:{
currentPathName:''
},
mutations:{
setPath(state){
state.currentPathName = localStorage.getItem("currentPathName")
}
}
})
export default store
3、在main.js中引入store
4、在router包下的index.js下添加路由守卫
//路由守卫
router.beforeEach((to, from , next ) =>{
localStorage.setItem("currentPathName",to.name) //设置当前路由名称
index.commit("setPath") //触发store的数