我正在學習如何使用 Routify 連接一些路由和鏈接。我需要幫助。在 Routify 文檔中它說:“可以通過多種不同方式處理鏈接。這可能是最簡單的方式”。通過: https ://routify.dev/guide/navigation然后它給出了這個例子:<script> import {isActive, url} from '@sveltech/routify' const links = [ ['./index', 'Home'], //add index if you don't want siblings to be considered children ['./blog', 'Blog'], ['./about', 'About'], ['./contact', 'Contact'] ]</script><style> .active {font-weight: bold}</style><ul> {#each links as [path, name]} <!-- Svelte magic. If isActive is true, the "active" class is applied. --> <li class:active={$isActive(path)}> <a href={$url(path)}> {name} </a> </li> {/each}</ul>不幸的是,它沒有給出任何關于如何將其連接到您的應用程序的說明(如果它對我來說太復雜了)。我正在使用 Routify 模板,并將上面的代碼復制到以下目錄中:頁面/_components/Navigation.svelte然后我嘗試將它導入到 pages/index.svelte 中:頁面/index.svelte <script> import Navigation from './_components/Navigation.svelte';</script><div> <Navigation/></div>鏈接顯示在頁面頂部。當我單擊它們時,端點遵循以下模式:http://localhost:5000/index/homehttp://localhost:5000/index/bloghttp://localhost:5000/index/abouthttp://localhost:5000/index/contact在我的/pages目錄中,我有與代碼中列出的頁面相匹配的頁面,例如:/pages/Home.svelte當我單擊鏈接時,我的瀏覽器停留在同一頁面上,并且不嵌入與該鏈接關聯的頁面。另外,我的瀏覽器開發工具說:Uncaught Error: Route could not be found for "/index/home". at urlToRoute (urlToRoute.js:15) at updatePage (navigator.js:13) at pushstate (navigator.js:60) at History.history.<computed> [as pushState] (navigator.js:51)我需要做什么才能看到相應的頁面,為什么它們的中間目錄名為“index”?如何去掉 url 中的“索引”一詞?
如何使用 Svelte Routify 創建路由鏈接
白衣染霜花
2022-12-22 13:43:59