VUE 返回页面不刷新实现代码

用 VUE 默认的 keep-alive 组件实现

实现方式：

1.在路由内设置页面是否需要缓存；

示例代码：（在需要的组件里面添加meta 对象，keepAlive属性，keepAlive 的值为是否需要缓存组件）

    {
      path:'/UpInfo',
      name:'UpInfo',
      component:UpInfo,
      meta:{
        keepAlive:true
      }

2.在 app.vue 里面使用 router-view 组件；

在 APP.vue 里面 使用 keep-alive 把 router-view 包裹起来，并且判断是否在路由里面设置的是否需要缓存。

<template>
  <div id="app">
    <keep-alive>
      <router-view v-if='$route.meta.keepAlive'/>
    </keep-alive>
      <router-view v-if='!$route.meta.keepAlive'/>
  </div>
</template>
<script>
  export default {
    data() {
      return {
      }
    },
    methods: {},
    mounted() {
    }
  }
</script>
<style scoped />

完成。就两步