URL에서 두 개의 매개변수를 가져와야 하는 Nuxt.js(버전 2.15.7)를 사용하는 단일 페이지 애플리케이션이 있습니다. 예:
으아아아세 개의 주소는 모두 실제로 다른 페이지로 리디렉션되지 않고 pages/index.vue
中找到的相同页面,我只是想能够读取$route.params.chapterNo
和$route.params.sectionNo
에서 렌더링되어야 합니다.
저는 nuxt.config.js
파일을 다음과 같이 편집하여 부분적으로 이를 달성했습니다.
유일한 문제는 이로 인해 이전 버전이 손상된다는 것입니다pages/index.vue
,并在每次路由到新的章节或部分时重新挂载一个新版本。每次路由更改时都会调用mounted()
. 하지만 페이지를 한 번만 마운트하면 됩니다. 주소 변경 시 애니메이션이 적용되지만 이 설정을 사용하면 전체 DOM이 지워지고 다시 작성되므로 애니메이션이 불가능해집니다. 전체 페이지를 다시 렌더링하지 않고 이 두 매개변수만 가져오는 라우팅 구성이 있습니까?
프로필을 삭제하려고 하는데 오류가 발생했습니다. component
属性,但这会导致页面未找到
에서 시도했지만 이는 모든 페이지만 캐시합니다. 경로가 변경될 때마다 다시 마운트됩니다. <Nuxt>
组件上使用keep-alive
를 사용해 보았습니다. 동일한 문제가 발생한 내 시도는 다음과 같습니다. router-extras
模块,并使用定义多个参数选项,但每次路由更改时也会重新挂载pages/index.vue
으아아아
? pages.index.vue
렌더링된 구성요소를 캐시하려면
으아아아<Nuxt>
组件上使用keep-alive
레이아웃에서:데모 1
특정 페이지만 캐시하려면
으아아아keep-alive-props.include
및 구성 요소 이름(예: 페이지 경로)을 사용하세요.데모 2
기본 레이아웃 파일에서
<Nuxt keep-alive />
查看Vue开发者工具时,注意到Nuxt为每个章节和部分创建了一个具有唯一键的pages/index.vue
를 사용하는 새로운 사례:이를 통해
<Nuxt nuxt-child-key="doNotReMount"/>
를 사용하여 페이지에 상수 키를 강제 할당하는 아이디어를 얻었습니다.이제 키는 새로운 경로마다 업데이트되지 않습니다.
pages/index.vue
페이지는 한 번만 마운트되며 모든 후속 경로는 동일한 페이지 인스턴스를 사용합니다!