vue-router是前端开发中用来实现路由页面跳转的一个模块。今天小编我便来给大家分享一下vue-router路由实现页面跳转的经验噢。
工具/原料
1
电脑 浏览器 编辑器
2
vue.js vue-router
方法/步骤
1
首先在页面中引入VueJS以及vue-router模块便OK了。
2
然后接着便可以编写vue路由的跳转规则了噢。使用router-link可以把文字设置成超链接的形式。而to则是指要跳转到哪个路由界面哦。而router-view则是页面呈现的地方。当路由跳转后所有的数据都会在router-view中呈现哦。
4
然后把定义的路由实例化成为vue-router对象即可。同时还需要把路由绑定到App组件上去才行哦。
5
做完之后打开浏览器便可以看到有两个超链接了噢。此时因为是默认的路由,所以router-view还不会加载出数据。
6
而点击其中一个便会触发对应的路由跳转,然后下面的router-view便会把组件数据给呈现出来了。
7
同理点击另外一个也是会呈现出设定的数据的噢。
注意事项
1
有用可以点赞。
2
没用可以找找其他方法。