若依删除从详情页面返回删除详情页面tab显示列表页tab

src\store\modules\tagsView.js

  	1:添加store  
  	      lastView: []
  	2:添加mutations
  	  SET_LAST_VIEW: (state, view) => {
  	    if(state.lastView.length == 0 ){
  	      state.lastView.push(view)
  	    }else if ( view.path != state.lastView[state.lastView.length - 1].path) {
  	      state.lastView.push(view)
  	    }
  	  },
  	  DEL_LAST_VIEW: (state) => {
  	    state.lastView.pop()
  	  }
   3:添加actions
      delLastView({ commit, state }, router) {
  	    if (state.lastView.length > 0) {
  	      router.push({
  	        path: state.lastView[state.lastView.length - 1].path
  	      })
  	      commit('DEL_LAST_VIEW')
  	    }
  	  }

src\utils\ruoyi.js

  1:添加全局方法
 		// 删除当前tab回到上一个tab
 	  export function goLastTab(store, router) {
 			if(!store || !router){
 				console.log('参数不正确,必须将$store和$router传进来')
 				return 
 			}
 			// 删除当前view
 			store.dispatch("tagsView/delVisitedView", router.currentRoute)
 			// 删除上一个view并将其中lastView中删除
 			store.dispatch("tagsView/delLastView", router)
 		}
 		
 		// 将当前tab存在缓存中,goLastTab的时候使用
 	  export function addLastTab(store,from){
 			if(!store || !from){
 				console.log('参数不正确,必须将$store和from传进来')
 				return 
 			}
 			store.commit('tagsView/SET_LAST_VIEW', from)
 		
 		} 

src\main.js

		1:在main中引入全局方法
				import { addLastTab, goLastTab } from "@/utils/ruoyi";
		2:挂载全局方法
		        Vue.prototype.addLastTab = addLastTab
 			Vue.prototype.goLastTab = goLastTab 

页面调用

 		1:列表页
   		     beforeRouteLeave (to, from, next) {
 			    // 设置上一次的菜单以便待会跳转回来
 			   this.addLastTab(this.$store,from)
 			    next()
 			  }, 
 		2:详情页
 		      this.goLastTab( this.$store,this.$router)

你可能感兴趣的:(前端,vue,vue)