当前位置:   article > 正文

关于vue-admin-beautiful框架 路由返回的处理_delvisitedroute(handleactivepath(route, true))

delvisitedroute(handleactivepath(route, true))

解决方案:

  1. //1.调用全局挂载vuex中的方法,关闭当前标签页
  2. //tabsBar/delVisitedRoute 是tabsBar.js 文件 mutations 里面的delVisitedRoute方法
  3. this.$store.dispatch('tabsBar/delVisitedRoute', this.$route)
  4. //2.返回上一页
  5. this.$router.go(-1)

方案来源:

框架的路由标签处理放在了vuex中

路径:src\store\modules\tabsBar.js

 tabsBar.js 文件内容如下:

  1. /**
  2. * @description tabsBar多标签页逻辑,前期借鉴了很多开源项目发现都有个共同的特点很繁琐并不符合框架设计的初衷,后来在github用户hipi的启发下完成了重构,请勿修改
  3. */
  4. const state = () => ({
  5. visitedRoutes: [],
  6. })
  7. const getters = {
  8. visitedRoutes: (state) => state.visitedRoutes,
  9. }
  10. const mutations = {
  11. addVisitedRoute(state, route) {
  12. let target = state.visitedRoutes.find((item) => item.path === route.path)
  13. if (target) {
  14. if (route.fullPath !== target.fullPath) Object.assign(target, route)
  15. return
  16. }
  17. state.visitedRoutes.push(Object.assign({}, route))
  18. },
  19. delVisitedRoute(state, route) {
  20. state.visitedRoutes.forEach((item, index) => {
  21. if (item.path === route.path) state.visitedRoutes.splice(index, 1)
  22. })
  23. },
  24. delOthersVisitedRoute(state, route) {
  25. state.visitedRoutes = state.visitedRoutes.filter(
  26. (item) => item.meta.affix || item.path === route.path
  27. )
  28. },
  29. delLeftVisitedRoute(state, route) {
  30. let index = state.visitedRoutes.length
  31. state.visitedRoutes = state.visitedRoutes.filter((item) => {
  32. if (item.name === route.name) index = state.visitedRoutes.indexOf(item)
  33. return item.meta.affix || index <= state.visitedRoutes.indexOf(item)
  34. })
  35. },
  36. delRightVisitedRoute(state, route) {
  37. let index = state.visitedRoutes.length
  38. state.visitedRoutes = state.visitedRoutes.filter((item) => {
  39. if (item.name === route.name) index = state.visitedRoutes.indexOf(item)
  40. return item.meta.affix || index >= state.visitedRoutes.indexOf(item)
  41. })
  42. },
  43. delAllVisitedRoutes(state) {
  44. state.visitedRoutes = state.visitedRoutes.filter((item) => item.meta.affix)
  45. },
  46. updateVisitedRoute(state, route) {
  47. state.visitedRoutes.forEach((item) => {
  48. if (item.path === route.path) item = Object.assign(item, route)
  49. })
  50. },
  51. }
  52. const actions = {
  53. addVisitedRoute({ commit }, route) {
  54. commit('addVisitedRoute', route)
  55. },
  56. async delRoute({ dispatch, state }, route) {
  57. await dispatch('delVisitedRoute', route)
  58. return {
  59. visitedRoutes: [...state.visitedRoutes],
  60. }
  61. },
  62. delVisitedRoute({ commit, state }, route) {
  63. commit('delVisitedRoute', route)
  64. return [...state.visitedRoutes]
  65. },
  66. async delOthersRoutes({ dispatch, state }, route) {
  67. await dispatch('delOthersVisitedRoute', route)
  68. return {
  69. visitedRoutes: [...state.visitedRoutes],
  70. }
  71. },
  72. async delLeftRoutes({ dispatch, state }, route) {
  73. await dispatch('delLeftVisitedRoute', route)
  74. return {
  75. visitedRoutes: [...state.visitedRoutes],
  76. }
  77. },
  78. async delRightRoutes({ dispatch, state }, route) {
  79. await dispatch('delRightVisitedRoute', route)
  80. return {
  81. visitedRoutes: [...state.visitedRoutes],
  82. }
  83. },
  84. delOthersVisitedRoute({ commit, state }, route) {
  85. commit('delOthersVisitedRoute', route)
  86. return [...state.visitedRoutes]
  87. },
  88. delLeftVisitedRoute({ commit, state }, route) {
  89. commit('delLeftVisitedRoute', route)
  90. return [...state.visitedRoutes]
  91. },
  92. delRightVisitedRoute({ commit, state }, route) {
  93. commit('delRightVisitedRoute', route)
  94. return [...state.visitedRoutes]
  95. },
  96. async delAllRoutes({ dispatch, state }, route) {
  97. await dispatch('delAllVisitedRoutes', route)
  98. return {
  99. visitedRoutes: [...state.visitedRoutes],
  100. }
  101. },
  102. delAllVisitedRoutes({ commit, state }) {
  103. commit('delAllVisitedRoutes')
  104. return [...state.visitedRoutes]
  105. },
  106. updateVisitedRoute({ commit }, route) {
  107. commit('updateVisitedRoute', route)
  108. },
  109. }
  110. export default { state, getters, mutations, actions }

可以看到 mutations 中还有很多标签的处理方法,如果代码是非异步直接调用就可以了。

如果是异步处理需要调用actions中的方法

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/从前慢现在也慢/article/detail/597896
推荐阅读
相关标签
  

闽ICP备14008679号