vue简易路由的原理
君哥
阅读:2504
2023-05-06 23:22:49
评论:1
需要实现两个功能
1、路径变化组件跟着变化
2、浏览器可以前进后退,组件变化
关键点:
1、vue 内置的动态组件 绑定 is 属性绑定组件名称
2、自定义路由规则,让url和组件名称一一对应
3、使用history.pushState(),第三个参数让url改变,同时改变url对象的组件名称
4、window.onpopstate(),点击浏览器的前进按钮/后退按钮触发的事件,获取到loction.pathname 来改变组件名称
代码参考如下:
APP组件
支持新文章