vue上线路由用什么模式

在Vue.js中，上线路由可以使用两种模式：hash模式和history模式。

1. hash模式：默认情况下，Vue.js使用的是hash模式。在hash模式下，路由会通过URL中的hash值（即#后面的部分）来切换页面。例如，路由为"/home"，在URL中的显示为"http://www.example.com/#/home"。当浏览器的URL发生变化时，Vue.js会根据hash值来匹配对应的路由，从而实现页面的切换。

优点：hash模式兼容性好，在所有浏览器中都可以正常使用，不需要对服务器进行额外的配置。

缺点：URL中会带有#，看起来不太美观；对搜索引擎的SEO不友好。

2. history模式：在使用history模式时，Vue.js会利用浏览器的History API来实现页面的切换。与hash模式不同的是，history模式下URL中不会包含#，而是正常的路径和参数。例如，路由为"/home"，在URL中的显示为"http://www.example.com/home"。

优点：URL干净，美观；对搜索引擎的SEO友好。

缺点：在不支持HTML5 History API的浏览器中，需要进行额外的配置；如果用户直接访问页面某个路由地址，而此时服务器不能正确响应该路由地址，将会返回404错误。

在Vue.js中使用哪种模式主要取决于项目的需求和实际情况。如果你的项目是一个单页应用，兼容性要求较高或者对SEO要求不高，那么使用hash模式是一个较好的选择。如果你的项目是一个多页面应用，对URL的美观性和SEO要求较高，那么使用history模式会更合适。可以通过在Vue的路由配置文件中配置"mode"属性来设置使用哪种模式。例如：

const router = new VueRouter({
  mode: 'history',
  // 其他配置项
})

在Vue.js中，上线路由可以使用两种模式：hash 模式和 history 模式。

1. Hash 模式：
   在 hash 模式下，路由路径会使用 URL 的 hash 值来进行管理。例如，路由路径为 http://example.com/#/home，其中的 #/ 即为 hash 值。在这种模式下，每次路由发生变化时，URL 中的 hash 值都会被修改，但不会引起页面的重新加载。Vue.js会通过监听浏览器的 hashchange 事件来实现路由的跳转和回退。

   使用 hash 模式的好处是兼容性良好，因为所有浏览器都支持 URL 中的 hash 值的修改。同时，不会导致页面的重新加载，用户体验较好。

   在Vue中，可以通过在 router 实例中设置 mode: 'hash' 来使用 hash 模式，如下所示：

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

2. History 模式：
   在 history 模式下，路由路径不再使用 URL 的 hash 值进行管理，而是使用 HTML5 提供的 history API。该 API 可以修改 URL 路径而不会引起页面的重新加载。例如，路由路径为 http://example.com/home。在这种模式下，每次路由发生变化时，URL 路径都会被修改，但不会重新加载页面。

   使用 history 模式的好处是URL相对美观，没有 # 符号，更符合正常的 URL 风格。同时，也可以通过浏览器提供的前进和后退按钮来进行页面的导航。

   在Vue中，可以通过在router实例中设置mode: 'history'来使用history模式，如下所示：

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

需要注意的是，当使用 history 模式时，后端服务器需要进行相应的配置，以确保路由路径的访问都指向同一个 HTML 文件，即 index.html，以避免在刷新页面或直接访问路由路径时出现 404 错误。

Vue.js 在进行路由上线时，可以采用两种不同的模式：hash 模式和 history 模式。

1. Hash 模式
   在 hash 模式下，URL 中会有一个特殊的标记（#），也称为哈希值。当 URL 中的哈希值发生改变时，浏览器并不会向服务器发送请求，而是通过监听 URL 的变化，通过 JavaScript 的 hashchange 事件来响应，从而实现页面的切换。hash 模式的 URL 形式如下：
   http://www.example.com/#/home

使用 Vue Router 进行路由配置时，在模式设置中可以选择 hash 模式，示例代码如下：
// 引入 Vue Router
import Vue from 'vue'
import VueRouter from 'vue-router'

// 使用 Vue Router
Vue.use(VueRouter)

// 创建 router 实例
const router = new VueRouter({
mode: 'hash', // 使用 hash 模式
routes: [
// 定义路由
]
})

2. History 模式
   在 history 模式下，URL 中不会出现特殊的标记，而是通过 HTML5 提供的 history API 来实现路由的切换。这种模式的 URL 更加友好，看起来更加简洁，例如：
   http://www.example.com/home

使用 Vue Router 进行路由配置时，可以选择 history 模式，示例代码如下：
// 引入 Vue Router
import Vue from 'vue'
import VueRouter from 'vue-router'

// 使用 Vue Router
Vue.use(VueRouter)

// 创建 router 实例
const router = new VueRouter({
mode: 'history', // 使用 history 模式
routes: [
// 定义路由
]
})

需要注意的是，在使用 history 模式时，需要服务器端进行相应配置，确保在浏览器中刷新页面或直接输入 URL 时，能够正确地返回对应的页面。

综上所述，Vue.js 在进行路由上线时可以选择 hash 模式或 history 模式，具体选择哪种模式取决于需求和实际情况。