Vue에서 이전 페이지 활성 유지

Vue에서 이전 페이지 활성 유지

Android 앱을 모방하는 작은 PWA를 만들고 있는데 Vuejs를 발견하게 되었습니다.

하지만 현재 해결할 수 없는 문제에 부딪혔습니다.홈페이지(영화/TV쇼/뉴스) 중 하나의 목록을 스크롤하고 해당 항목을 클릭할 때 사용자가 다시 이동할 때 동일한 항목으로 이동하기 위해 다시 스크롤할 필요가 없도록 해당 목록의 위치를 유지하고 싶습니다.

제가 몇 가지 시도를 해봤는데keep-alive어떻게 작동하는지 이해하지 못합니다.현재 제 앱 페이지는 이렇습니다.사용하다:key="$route.fullPath"영화 사이를 이동할 때 세부 페이지를 새로고침합니다.

<div id="content">
  <keep-alive>
    <transition :name="transitionName" mode="out-in">
      <router-view :key="$route.fullPath"></router-view>
    </transition>
  </keep-alive>
</div>

<div class="bottom">
  <div class="bottom-bar">
    <md-bottom-bar md-type="shift" md-sync-route>
      <md-bottom-bar-item id="bottom-bar-item-movies" md-label="Movies" to="/movies"
                          md-icon="movie"></md-bottom-bar-item>
      <md-bottom-bar-item id="bottom-bar-item-tvshows" md-label="TV Shows" to="/tvshows"
                          md-icon="tv"></md-bottom-bar-item>
      <md-bottom-bar-item id="bottom-bar-item-watchlist" md-label="News" to="/news"
                          md-icon="language"></md-bottom-bar-item>
    </md-bottom-bar>
  </div>
</div>

상세 페이지에는 다음과 같은 유형의 이름과 ID가 포함된 경로가 있습니다./movies/348350. 상세페이지에는 를 사용하여 되돌아가기 위한 버튼이 있습니다.this.$router.go(-1).

지금까지 놓치기 쉬운 방법이 있을까요?

의사들에 따르면<keep-alive>안에 있어야 합니다.

<transition :name="transitionName" mode="out-in">
  <keep-alive>
    <router-view :key="$route.fullPath"></router-view>
  </keep-alive>
</transition>

언급URL : https://stackoverflow.com/questions/52525638/keep-previous-page-in-vue-alive