vue路由跳转，不让页面刷新，怎么做？

Question

左边的导航是用路由进行点击跳转的，我想让这两个路由切换的时候，表单填写的数据不消失，就是第一个页面跳走,再回来的时候也有数据，想知道怎么实现？求大神帮助

Answer 1

用vue的keep-alive来缓存组件,用include属性来缓存指定name的组件

例如:
<keep-alive include='test'>
<router-view><router-view>
</keep-alive>

new Vue({

el:#test,
name:'test'

})

Answer 2

把两个页面 合并成一个组件 然后 路由配置传参数
类似{

  path: '/task/pending',
  name: 'TaskPending',
  component: TaskCommon,
  meta: { 'status': 0 },
}这样 可以在this.$route中获取到相应参数 然后 区分显示

Answer 3

动态组件的keep-alive：https://cn.vuejs.org/v2/guide...

Answer 4

肯定会刷新的
给你个建议 填写的数据 俩个组件把值进行传递
和你要达到的效果一样

Answer 5

我现在项目里就有类似你这种多组件切换，状态需要保留的需求，更变态的还有需要多开同一个组件的的需求。
keep-alive无法满足需求，后来尝试继续在每个页面是独立路由的基础上，将每个页面的数据存起来（vuex）。
写起来非常费劲，遂放弃。
现在采用的是不用路由，每个页面都在一个根路由下，使用tab页切换来完成不同组件的展示（使用 component is）。因为切换组件，只是切换了展示的dom所以之前的状态可以保存，且完美支持多开。这种方案的缺点是无法懒加载，如果是后台系统，不考虑首屏时间，推荐使用这种方案。

Answer 6

我也遇到同样的问题，请问你是怎么解决的