web-dev-qa-db-ja.com

ルータービューのすべてのルートではなく、単一のルートでキープアライブ

以下のようにルータービューにキープアライブが指定されている場合

<keep-alive>
    <router-view></router-view>
</keep-alive>

そのルートが再訪されると、すべてのルートが効果的にキャッシュされ、リロードされます。

個々のルートでキープアライブオプションを指定できるようにしたいと思います。

多くのルートと、再レンダリングキャッシングを行わずに1つまたは2つだけを維持する必要がある場合、すべてのルートは役に立ちません

それを行う方法や回避策はありますか

vue.jsvuejs2vue-componentvue-router
15
boomerboy

https://jsfiddle.net/Linusborg/L613xva0/4/

Vueバージョン2.1.0、コンポーネントを条件付きでキャッシュするためのincludeおよびexcludeプロパティの新機能。nameオプションの使用に注意してください。

const Foo = {
    name: 'foo',
  template: '<div><p v-for="n in numbers">{{ n }}</p></div>',
  data: function() {
    return {
        numbers: [Math.round(Math.random() * 10), Math.round(Math.random() * 10)]
    }
  }
}

const Bar = {
    name: 'bar',
    template: '<div><p v-for="n in numbers"><strong>{{ n }}</strong></p></div>',
  data: function() {
    return {
        numbers: [Math.round(Math.random() * 10), Math.round(Math.random() * 10)]
    }
  }
}
17
Eric Guan