Vue Router(8)
作者:互联网
在创建路由器实例时,history 配置允许我们在不同的历史模式中进行选择
Hash模式
hash 模式是用 createWebHashHistory() 创建的
import { createRouter, createWebHashHistory } from 'vue-router' const router = createRouter({ history: createWebHashHistory(), routes: [ //... ], })
它在内部传递的实际URL之前使用了一个哈希字符(#)。由于这部分URL从未发送到服务器,所以它不需要再服务器层面上进行任何特殊处理。不过,它在SEO中确实有不好的影响。如果你担心这个问题,可以使用HTML5模式。
HTML5模式
用 createWebHistory() 创建HTML5模式,推荐使用这个模式:
import { createRouter, createWebHistory } from 'vue-router' const router = createRouter({ history: createWebHistory(), routes: [ //... ], })
当使用这种历史模式时,URL会看起来很正常
不过,如果没有适当的服务器配置,用户在浏览器中直接访问 https://example.com/user/id, 就会得到404错误。
要解决这个问题,你需要做的就是在你的服务器上添加一个简单的回退路由。如果URL不匹配任何静态资源,它应提供与你的应用程序中的 index.html 相同的页面
标签:Vue,URL,router,模式,服务器,createWebHistory,createRouter,Router 来源: https://www.cnblogs.com/zhishiyv/p/15904161.html