1、修改AppMain.vue
将 加载组件的地方,使用keep-alive包含起来
......
<keep-alive>
<router-view/>
</keep-alive>
......
2、修改具体的业务代码
假设有一个用户管理的页面,修改该页面里面的代码。
在使用keep-alive 时
created():不会在每次进入页面时执行,而是只执行一次。
activated():每次进入页面时执行的activated 内的方法,但是当后端数据没变化时,不会重载该页面。
......
activated: function () {
this.get_need_data() // 这是用于获取数据的异步方法
},
created: function() {
this.get_need_data()
},
......
保存代码,重新运行就会发现当第一次渲染好页面后,再次进入页面时不会再次加载渲染