vue keep-alive的简单使用

缓存组件（全部缓存）

来到的你app.vue

<keep-alive>
    <router-view>
        <!--这里是会被缓存的视图组件 -->
    </router-view>
</keep-alive>

如果你想选择性缓存

在app.vue写成这样（vue2.0只能有一个根节点）

<div>
    <keep-alive>
        <router-view v-if="$route.meta.keepAlive"></router-view>
    </keep-alive>
    <router-view v-if="!$route.meta.keepAlive"></router-view>
</div>

然后来到你的路由

router.js

{
    path: '/',
    name: 'home',
    component: Home,
    meta: {
        keepAlive: true // 需要被缓存
    }
}, {
    path: '/:id',
    name: 'edit',
    component: Edit,
    meta: {
        keepAlive: false // 不需要被缓存
    }
}

大概就这样还有很多方法

       我推荐这个博客：http://www.jianshu.com/p/0b0222954483  写得不错基本的业务要求都写了