Vue 这两天在弄 Vue，想请教一下 Vue 里面回到上一个页面怎么样才能不重复渲染

ad583255925 · 2017年10月26日 · 最后由 dilisk 回复于 2018年03月22日 · 7388 次阅读

export default new Router({
  routes: [
    {
      path: '/',
      name: 'CardList',
      component: CardList,
    },
    {
      path: '/cards/:id',
      name: 'CardDetail',
      component: CardDetail
    }
  ]
})

就两个页面，求助一下用过 Vue 的

pynix #1 2017年10月26日

返回页面必然重新渲染吧。。。

yingce #2 2017年10月26日

keep-alive 特别好用

ad583255925 #3 2017年10月27日

对

pynix 回复

React 就不会啊

ad583255925 #4 2017年10月27日

对

yingce 回复

想问下具体用法，我这边用了之后是一片空白，不知道为什么

<template>
    <div class="card_list">
        <keep-alive>
            <table class='table'>
               ...
            </table>
        </keep-alive>
    </div>
</template>

路由设置

export default new Router({
  routes: [
    {
      path: '/',
      name: 'CardList',
      component: CardList,
      meta: { keepAlive: true }
    }
  ]
})

keep-alive里面的组件都是一片空白

pynix #5 2017年10月27日

对

ad583255925 回复

难道我用的是假的 react？route 改变了，会转换状态吧，然后就重新渲染了吧。

yingce #6 2017年10月29日

对

ad583255925 回复

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

keep-alive 可以直接嵌在路由里面这个每个页面重新回来的时候不会执行 created 会执行 activated

ad583255925 #7 2017年10月30日

对

yingce 回复

多谢，已经解决了

需要登录后方可回复, 如果你还没有账号请注册新账号