vue 페이지 전환 페이지 캐 시 작업 실현

업무 수요
타 야 는 A 페이지 야 구 에서 파란 아빠 한 마 리 를 때 렸 다.그리고 네 비게 이 션 바 를 클릭 하여 B 페이지 의 야 구 쇼 조작 으로 빨 간 아빠 한 마 리 를 때 렸 다.그리고 그 는 다시 A 야 구 로 돌 아 왔 다.A 야 구 는 파란 아빠 한 마리 만 맞 은 상 태 였 으 면 좋 겠 다.다른 야 는 도 둑 맞 지 않 았 다.
첫걸음
경로 에 캐 시 할 페이지 를 설정 합 니 다.

두 번 째 단계
keep-alive 속성 패 키 지 를 사용 하려 면 캐 시가 필요 한 페이지 는 v-if 로 판단 합 니 다.true 는 캐 시가 필요 합 니 다.false 는 캐 시가 필요 없습니다.

세 번 째 단계
캐 시가 필요 한 페이지 에 네 비게 이 션 갈 고 리 를 설정 하고 A 필드 에서 떠 날 때 값 을 false 로 설정 하여 현재 필드 에서 도 둑 맞 지 않도록 합 니 다.

네 번 째 단계
다른 야 구 의 파도 가 한 번 떠 날 때 true 로 설정 하여 A 야 구 로 돌아 갈 때 야 구 는 새로 고침 되 지 않 고 원래 의 상태 가 되도록 합 니 다.

추가 지식:vue keep-alive 는 고정 페이지 에서 뛰 어 오 는 것 만 현재 페이지 를 캐 시 합 니 다.
문제 설명
keep-alive+beforerRoute Leave 를 사용 하여 캐 시 페이지 에 들 어 갈 때 keep-alive 를 true 또는 false 로 설정 하 였 으 나 수 요 를 만족 시 키 지 못 하여 A 페이지 가 B 페이지 로 넘 어간 후 캐 시 없 음 C 페이지 가 B 페이지 로 넘 어간 후 캐 시가 있 음 을 판단 하 였 으 나 다시 A 페이지 에서 B 페이지 로 넘 어가 C 페이지 로 넘 어간 후 지난번 데 이 터 를 가 져 왔 습 니 다.
해결 방법
A-B 또는 C-B 는 캐 시 트리거 keep-alive 의 activated 갈 고 리 를 설정 합 니 다.vuex 를 이용 하여 B 페이지 에서 어느 페이지 로 넘 어 왔 는 지 판단 합 니 다.A 페이지 에서 넘 어 온 초기 화 B 페이지 의 모든 데 이 터 를 사용 하지 않 으 면 아무런 조작 도 하지 않 으 면 됩 니 다.
이상 의 vue 페이지 가 이동 하여 페이지 캐 시 작업 을 실현 하 는 것 은 바로 작은 편집 이 여러분 에 게 공유 하 는 모든 내용 입 니 다.여러분 께 참고 가 되 고 저 희 를 많이 사랑 해 주 셨 으 면 좋 겠 습 니 다.