微信vue路由跳转兼容_vue使用感受（二）组件间跳转

想要看代码高亮的可以去我的微信公众号(pearapple_2015)查看。

昨天我们聊了一下vue的组件间传值，今天来讨论下我遇到的第二个问题组件间跳转。在不使用前端框架的时候，如果我们要点击菜单跳转到指定页面，一般来说可以使用标签或者在页面中嵌套iframe。前者可以改变页面路径或者通过锚点来跳转到页面指定位置，后者则是在页面中嵌套一个子页面，可以部分刷新，改变内容。不过HTML5已经不再支持iframe了，所以要做到部分页面跳转等功能，我们可以借助一下vue。

前言

在vue这边，如果要跳转页面一般是借助vue-router的，也就是路由。但是路由跳转到不同地址时，会使得页面刷新。如果页面中包含Header、Footer等不需要刷新的组件，用户可能还是会看到闪了一下，或者加载时候的空白。所以我们需要在不改变路由路径的情况下，替换页面部分组件。我找到的方法是使用标签。如果有大佬有其他方法可以留言告诉我~

接下来我们就从这两种情况分别谈一谈。

vue-router

vue的一大特色就是文档写得很好，许多问题我们都可以在文档上找到答案。对于vue-router也是有一个很完善的文档的，大家可以先去那边看看。安装的步骤我这边也不提了。https://router.vuejs.org/zh-cn/

我就举一下我做的测试系统的例子。在安装完成之后我们在src文件夹下创建一个router.js的文件。如果你使用的是我之前推荐的iView的工程，那这个文件已经建好了。PS：router.js这个文件的名字其实可以根据你的喜好来改的，只要你在main.js中引入的时候和这个名字一致就可以了。不过狐狸还是推荐你用带有router字眼的文件名，这