vue-router가 라우팅 매개변수의 변경에 응답하는 방법에 대한 솔루션

이 글의 내용은 라우팅 매개변수 변경에 대응하기 위한 vue-router의 솔루션에 대한 내용입니다. 필요한 친구들이 참고하시면 도움이 될 것입니다.

1 참고로, /user/foo에서 /user/bar로 이동하는 등 라우팅 매개변수를 사용하면 원래 구성 요소 인스턴스가 재사용됩니다. 두 경로 모두 동일한 구성 요소를 렌더링하므로 이를 파괴하고 다시 만드는 것보다 재사용하는 것이 더 효율적입니다. 그러나 이는 구성 요소의 수명 주기 후크가 더 이상 호출되지 않음을 의미하기도 합니다.
경로의 매개변수만 변경되었으며, 기본적으로 경로가 새로 고쳐지지 않습니다.
이 문제를 해결하려면
재사용을 원하지 않으면 상위 구성 요소의 router-view에 키를 추가하세요
< /router-view>

2. vue-router IOS의 흰색 화면 문제입니다.
문제 설명:

페이지 A——>B——>ios 내장 반환 ——>흰색 화면이 나타남—— —> 흰색 화면을 수동으로 클릭 —> 문제 해결

원인 분석:

iOS 기기에서 웹뷰를 사용하여 Vue 프로젝트를 개발할 때 이동 기록(-1)을 풀다운할 수 없습니다. 몸의 높이가 가려져 가벼운 클릭을 유발하여 마스크가 제거됩니다

솔루션 구현 원칙:

html, 본문은 모두 100%, #app는 상위 요소 알림을 지원하지만 기본 스크롤 브라우저의 스크롤은 #app 은 아니지만 본체, 몇 가지 요인으로 인해 히스토리로 복귀한 후 복구가 불가능하게 되었습니다(ios 오류). 이러한 이유로 #app 을 절대 위치에 두고 다시 스크롤 객체로 만들었습니다. 이를 통해 문제를 해결합니다

html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  position: relative;
}
#app {
  width: 100%;
  height: 100%;
  background: #fff;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
  position: absolute;
  left:0;
  top:0;
}

#app 是父节点，最外层的container。根据具体情况而定

위 내용은 vue-router가 라우팅 매개변수의 변경에 응답하는 방법에 대한 솔루션의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!