vue-router 전환 tab 탭 이 닫 혔 을 때 캐 시 문 제 를 해결 합 니 다.

router 입구 페이지 에 keepAlive:true/캐 시 되 어야 합 니 다 false 는 필요 없습니다.

 {
  path: 'fundProListG',
  component: resolve => require(['@/pages/product/fundPros/fundTab/fundTab.vue'], resolve),
  title: '    ',
  redirect: 'fundProListG/fundProListG',
  meta: {
  keepAlive: false //       
  },
  children: [{
  path: 'fundProListG',
  component: resolve => require(['@/pages/product/fundPros/fundProListG.vue'], resolve),
  meta: {
  keepAlive: true //      
  }
  },{
  path: 'fungAdm',
  component: resolve => require(['@/pages/product/fundPros/fungAdm.vue'], resolve),
  meta: {
  keepAlive: true //      
  }
  }]
 },

App.vue(당신 이 쓴탭 은 어디에서 바 꿉 니까?)

<keep-alive>
 <router-view v-if="$route.meta.keepAlive"></router-view>
 </keep-alive>
 <router-view v-if="!$route.meta.keepAlive"></router-view>

탭 을 닫 을 때 현재 페이지 캐 시 에 추가 하지 않 으 려 면

이 어 첫 번 째 캐 시 를 만 났 고 두 번 째 는 false 로 바 꾼 후 캐 시 되 지 않 음 을 열 었 습 니 다.탭 페이지 를 닫 고 이것 을 추가 합 니 다.

추가 지식:vue-router 를 통 해 tab 페이지 를 열 고 다음 에 들 어 갈 지,아니면 지난번 history 캐 시 인터페이스 상태 에 들 어 갈 지 에 대한 문 제 를 해결 합 니 다.
1.문제 설명:
1.점프 모드:인터페이스 A->인터페이스 B(인터페이스 A 에서 this.$router.push({name:'구성 요소 B 이름',params:{매개 변수})새 tab 페이지 를 여 는 방식 으로 인터페이스 B 를 엽 니 다.)
2.인터페이스 B 를 닫 고 인터페이스 A 로 돌아 가기
3.다시 A 에서 B 에 이 르 렀 을 때 열 린 인터페이스 B 는 지난번 상태 이 고 전달 하 는 매개 변수 가 다 르 더 라 도.
다른:router 성명 은 다음 과 같 습 니 다.

{
 path: 'demo/pageB',
 name: 'pageB',
 component: _import('demo/pageB'),
 meta: {
  requiresAuth: true,
  keepAlive: false, //       
  title: '  B'
 }
}
 

2.원인:vue-router홈 페이지참조

3.해결 방법:인터페이스 B 가 떠 날 때 구성 요 소 를 소각 합 니 다.코드 는 다음 과 같 습 니 다:

//                [         `this`]
beforeRouteLeave (to, from, next) {
 //     ，    vue-router     ，     history     
 this.$destroy(true)
 next()
}　　

더 많은 beforeRoute Leave 참조홈 페이지
4.기타 해결 방법(미 성공):
vue-router 홈 페이지 에 router.replace(location,onComplete?,onAbort?) history 에 기록 을 추가 하지 않 는 방식 이지 만 저 는 성공 을 시도 하지 못 했 습 니 다.구체 적 인 원인 은 모 르 겠 습 니 다.
홈 페이지 설명:

나의 쓰기:
this.$router.replace({name:'구성 요소 B 이름',params:{매개 변수},()=>{this.warning('test!')},()=>{this.warning('test!') }) 　　
이 문 제 는 vue-router 전환 tab 탭 이 닫 혔 을 때 캐 시 문 제 를 해결 하 는 것 이 바로 작은 편집 이 여러분 에 게 공유 하 는 모든 내용 입 니 다.참고 하 시기 바 랍 니 다.여러분 들 도 저 희 를 많이 사랑 해 주 셨 으 면 좋 겠 습 니 다.