vue2实现面包屑功能

本文主要是介绍vue2实现面包屑功能，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

目录

1. store/index.js

2. router/index.js

3. Header.vue

---

在Vue 2中实现面包屑导航是一种常见的前端实践，它可以帮助用户了解当前页面在网站结构中的位置，并快速导航到上一级或根目录。以下是使用Vue 2实现面包屑导航的基本步骤：

1. store/index.js

state中定义一个面包屑名称：currentPathName

mutations中定义一个方法：

export default new Vuex.Store({state: {currentPathName: ''},getters: {},mutations: {setPath (state) {state.currentPathName = localStorage.getItem('currentPathName')}},actions: {},modules: {}
})

2. router/index.js

使用路由守卫获取路

这篇关于vue2实现面包屑功能的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---