当前位置:首页 > 编程笔记 > 正文
已解决

Vue 路由缓存 防止路由切换数据丢失 路由的生命周期

来自网友在路上 11028102提问 提问时间:2023-11-20 16:02:01阅读次数: 102

最佳答案 问答题库1028位专家为你答疑解惑

在切换路由的时候,如果写好了一丢数据在去切换路由在回到写好的数据的路由去将会丢失,这时可以使用路由缓存技术进行保存,这样两个界面来回换数据也不会丢失
在这里插入图片描述

在 < router-view >展示的内容都不会被销毁,路由来回切换数据也不会丢失,但是这样写使用在 < router-view >展示的路由都会被缓存

  <keep-alive><router-view></router-view><!-- 路由器占位符 --></keep-alive>

指定缓存的组件

//User组件
<script>export default ({name: 'User',      })
</script>
<!--include的User是组件名--><keep-alive include="User"><router-view></router-view><!-- 路由器占位符 --></keep-alive>

这种方式只能设置一个或全部缓存 如果想指定两个需要这样操作

 :include="['User','Login']"

路由生命周期

activated(){
//路由被激活时},
deactivated(){
//路由被切换走时}

这两个是路由专有的生命周期,如果组件被缓存,是不会调用created和销毁函数的,这时候可以使用这两个函数

查看全文

99%的人还看了

猜你感兴趣

版权申明

本文"Vue 路由缓存 防止路由切换数据丢失 路由的生命周期":http://eshow365.cn/6-40460-0.html 内容来自互联网,请自行判断内容的正确性。如有侵权请联系我们,立即删除!