vue学习指南:第十三篇(详细) - Vue的 路由 第三篇 ( 路由的缓存 )

路由的缓存

路由缓存是 Vue组件优化的一个重要方法

为什么实现路由缓存?

  为了 组件间 相互切换不会重复加载数据,影响用户体验,我们通常需要将组件的数组实现缓存,当我们点过来,在点的时候会再次发送 ajax,想让它发送之后把数据存起来。

  我们需要,当我点击的时候直接出来

<keep-alive>
    <router-view>router-view>
keep-alive>
步骤一:路由的写法
{
    path:"/find/nan",
       name:"nan",
       component:Nan,
       meta:{
           keepAlive:true
       }
},

 

为true 这个组件就缓存,为false 就不缓存

步骤i二:app.vue中

  使用 标签将 包裹起来。

keep-alive 是什么?

  包裹动态组件时,会缓存不活动的组件实例,而不是销毁他们,他自身不会渲染一个 dom 元素 也不会出现在父组件中。

 

作者:晋飞翔
手机号(微信同步):17812718961
希望本篇文章 能给正在学习 前端的朋友 或 以及工作的朋友 带来收获 不喜勿喷 如有建议 多多提议 谢谢!!!

你可能感兴趣的:(vue学习指南:第十三篇(详细) - Vue的 路由 第三篇 ( 路由的缓存 ))