当前位置:   article > 正文

vue实现局部页面缓存+返回上一页传参_vue2 返回上一页传值

vue2 返回上一页传值

问题说明:

在使用vue开发的过程中难免会遇到这种问题:

1、当我们需要前往另一个页面去做其他操作后,返回上一个页面,上一个页面的状态会被刷新,我们需要让上一个页面的状态保留。

2、当我们返回上一页的时候如何把参数传回上一页。

解决思路:

1、使用keep-alive :include="caches"来实现页面状态的保留,通过动态修改caches来达到局部页面缓存,include会缓存包含的页面。所以你可以将需要缓存的几个页面放在caches中,当退出这几个页面的时候再取消缓存。

2、通过localstorage来达到传参给上一页的目的,在进入页面的时候查询缓存参数是否存在,存在的话,取得参数后清除掉缓存,在进入下个页面的时候再设置好缓存参数。

实现方法:

1,、局部页面缓存,保存页面状态:

  1. <template>
  2. <div id="app">
  3. <keep-alive :include="caches">
  4. <router-view style="height: 100%; min-height:100%;"/>
  5. </keep-alive>
  6. </div>
  7. </template>
  8. <script>
  9. export default {
  10. name: "Layout",
  11. computed: {
  12. caches(){
  13. if(this.$route.path=="/buyOrder" || this.$route.path&#
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/码创造者/article/detail/824638
推荐阅读
相关标签
  

闽ICP备14008679号