vue路由的两种模式hash与history原理
Vue路由有两种模式：哈希模式（hash mode）和历史模式（history mode）。
1. 哈希模式（hash mode）：
该模式下的路由实现原理：
当使用VueRouter创建路由实例时，如果不指定`mode`，则默认为哈希模式。
当切换路由时，VueRouter会监听锚点的变化，并根据变化的锚点到对应的路由配置信息，然后根据路由配置信息更新组件的显示。
优点：
-实现简单，不依赖于服务器配置。
-兼容性好，支持所有主流浏览器。
缺点：
-URL中夹杂着`#`，对于SEO不友好。
-URL不太美观。
2. 历史模式（history mode）：
该模式下的路由实现原理：
设在`mode`为`history`时，VueRouter会使用HTML5的History API。
在页面加载时，VueRouter会根据当前URL的路径到对应的路由配置信息，并渲染对应的组件。
当切换路由时，VueRouter会通过History API将新的URL地址添加到浏览器的历史记录中，并根据新的URL重新加载组件。
优点：
-URL美观，没有`#`。
-react router的优点
内置浏览器前进后退功能，用户体验好。
-与传统的后端路由更为一致。
缺点：
-需要服务器配置，以避免路由不到后返回404
- 兼容性较差，部分旧版本浏览器不支持History API。
在选择路由模式时，一般建议使用历史模式，因为它能提供更好的用户体验和SEO优化。但在实际开发中，需要根据项目的具体需求和目标平台来选择合适的路由模式。比如，如果需要考虑兼容性，可以选择哈希模式；如果需要考虑SEO，可以选择历史模式。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。