vue路由history模式

Vue路由提供两种模式：hash模式和history模式。默认情况下，Vue路由使用的是hash模式，它的特点是在URL中加入#符号，例如：http://example.com/#/path。而history模式则是使用HTML5 History API，可以在不刷新页面的情况下更改URL，例如：http://example.com/path。

要启用history模式，需要在创建Vue Router实例时传入一个mode选项，例如：

const router = new VueRouter({
  mode: 'history',
  routes: [...]
})

需要注意的是，在使用history模式时，如果用户直接访问了一个没有被服务器配置的URL，会返回404错误，因此需要在服务器端进行配置。

相关问题

vue路由history模式下nginx后台配置

Vue路由的History模式是一种利用浏览器的History API来实现路由跳转的模式，它的优点在于可以消除URL中的#号，并且更加美观，但需要后台支持。在使用Nginx作为后台服务器时，需要对Nginx进行相关配置。

首先，在Nginx的配置文件中需要添加如下配置：

location / {
    try_files $uri $uri/ /index.html;
}

以上配置表示如果请求的文件或目录不存在，则转发到index.html，这样Vue的前端路由就能够正常运作。

另外，还需要配置Nginx的静态资源目录，例如：

location /static/ {
    root /var/www/myapp;
}

表示请求/static/文件时，将交由/var/www/myapp目录下的文件处理。

需要注意的是，如果使用Vue的History模式，很可能会出现“404页面找不到”的错误，因为Nginx接收到的URL都是以/开头的，Nginx会将这些URL视为文件路径进行处理，而不是Vue路由中的路径。这时候需要对Nginx进行进一步配置，例如：

location /app/ {
    try_files $uri $uri/ /app/index.html;
}

表示所有以/app/开头的请求都交由/app/index.html处理，这样就可以解决404页面找不到的问题。

总之，对于Vue路由的History模式，需要在Nginx服务器上进行相关的配置，保证前后端的对接顺畅，使得应用程序能够正常运行。

vue路由history模式刷新页面时页面丢失

当使用 Vue 路由的 history 模式时，刷新页面会导致页面丢失的原因是因为在 history 模式下，Vue 路由是使用 HTML5 History API 来实现的，而刷新页面会向服务器发送请求，在服务器端找不到对应的路由，就会返回 404 错误页面。

为了解决这个问题，需要在服务器端配置一个 fallback 页面，即当服务器找不到对应路由时，返回的是一个固定的页面，而不是 404 错误页面。

具体的配置方法因服务器而异，如果你使用的是 Nginx 服务器，可以在 Nginx 配置文件中添加如下配置：

location / {
  try_files $uri $uri/ /index.html;
}

这样，当服务器找不到对应的路由时，就会返回 index.html 页面，从而解决页面丢失的问题。