hash 模式

• 優點

簡單性：哈希路由相對容易設置，不需要伺服器進行額外配置。 跨瀏覽器兼容性：哈希路由在所有主流瀏覽器中都支持良好。

• 缺點

URL 不美觀：包含哈希的 URL 通常看起來不夠專業。

SEO 不佳：由於哈希部分不會被伺服器處理，對於搜索引擎優化（SEO）來說，使用哈希路由會有劣勢。

• 例子

如果你使用哈希模式的 Vue Router，路由配置可能會如下所示：

import { createRouter, createWebHashHistory } from 'vue-router';

const routes = [
    { path: '/', component: Home },
    { path: '/about', component: About },
];

const router = createRouter({
    history: createWebHashHistory(),
    routes,
});

在這種情況下，當你訪問 /about 時，實際的 URL 會是 http://example.com/#/about。

這樣，路由的改變不會導致整個頁面重新加載，增強了用戶體驗。

---

Vue 預設是使用 hash 模式，但可選擇使用 history 模式。

hash 模式時的 URL 會帶 # 符號，例如 https://example.com/#/about 跳轉時不會發出 HTTP 請求，只會按 # 後的內容來顯示相應的元件。

history 模式不會帶 #，例如 https://example.com/about。

跳轉頁面時會發 HTTP 請求。

背後原理是使用 Web History API 和 建構 Router 來避免重刷頁面。但注意，history 模式需配合後端設定，把找不到的路由全都指向 index.html，才不會出現 404 的問題。