IT이야기

어떻게 하면 iframes를 백그라운드에서 살려둘 수 있을까?

cyworld 2022. 3. 29. 21:55
반응형

어떻게 하면 iframes를 백그라운드에서 살려둘 수 있을까?

나는 iframes가 2개인 간단한 Vue.js 앱을 가지고 있다.

Vue Router를 사용하여 두 iframes 간에 전환하고 싶지만 iframes를 백그라운드에서 "alive" 상태로 유지하여 매번 iframe을 다시 로드할 필요가 없도록 하고 싶다.

왜 다음의 바이올린들이 작동하지 않는지 아십니까?(뒤로 전환할 때마다 iframes를 다시 로드하도록 설정)

http://jsfiddle.net/c3umtepz/1/

<div id="app">
  <router-link to="/">/youtube.com</router-link>
  <router-link to="/foo">/adobe.com</router-link>
  <keep-alive>
    <router-view></router-view>
  </keep-alive>
</div>

여기서 keep-alive는 작동하지 않는다. 해결책은v-show오직 옳다

keep-alive 원칙은 노드 정보를 VNode(메모리)의 구성요소에 보관하고 렌더링이 필요할 때 VNode에서 실제 DOM으로 렌더링하는 것이다.iframe 페이지의 콘텐츠는 노드의 정보에 속하지 않으므로 keep-alive를 사용하면 iframe의 콘텐츠가 여전히 다시 렌더링된다.

참조URL: https://stackoverflow.com/questions/45662534/how-can-i-keep-iframes-alive-in-the-background

반응형