英文:
Get current path in svelte-routing
问题
我正在尝试访问当前路由,以便在当前路由为"/"时有条件地重定向访问者。目前我设置的方式是,如果在地址栏中键入任何路由,重定向都会发生。我目前唯一的候选解决方案是创建一个存储,保存当前路径,并使用该存储来设置导航条件,只有在存储值为"/"时才导航。但我想知道是否有更高效的方法来实现这一点?
以下是app.svelte的代码:
<script>
import { Router, navigate, Route } from "svelte-routing";
import { user, loading } from "./lib/store";
import Authentication from "./features/authentication/Authentication.svelte";
import Notes from "./features/notes/Notes.svelte";
import Read from "./features/notes/components/Read.svelte";
import Create from "./features/notes/components/Create.svelte";
import Folders from "./features/folders/Folders.svelte";
// 我想要在下面执行if(!$loading && path=="/")的操作
$: if (!$loading) {
if ($user) navigate("/folders");
else navigate("/authenticate");
}
</script>
{#if $loading}
loading..
{/if}
<Router>
{#if $user}
<Route path="/notes/read/:id" let:params>
<Read id={params.id} />
</Route>
<Route path="/notes/create" component={Create} />
<Route path="/notes" component={Notes} />
<Route path="/folders" component={Folders} />
{:else}
<Route path="/authenticate" component={Authentication} />
{/if}
</Router>
我已经尝试使用useLocation来获取当前路径。不幸的是,由于App.svelte不是路由器的子代,这不起作用,并且该函数返回undefined。
英文:
I'm trying to access the current route in order to conditionally redirect visitor incase the current route is "/". The way I have set up right now the redirection happens at any route if you type it in the addressbar. The only candidate solution I have right now is creating a store that holds the current path and using that store to set up the condition to navigate only if the store value is "/". But I am wondering if there is a more efficient way to do this?
here is app.svelte
<script>
import {Router, navigate, Route} from "svelte-routing";
import { user, loading } from "./lib/store";
import Authentication from "./features/authentication/Authentication.svelte";
import Notes from "./features/notes/Notes.svelte";
import Read from "./features/notes/components/Read.svelte";
import Create from "./features/notes/components/Create.svelte";
import Folders from "./features/folders/Folders.svelte";
//i want to do if(!$loading && path="/") below
$: if(!$loading) {
if($user) navigate("/folders");
else navigate("/authenticate");
}
</script>
{#if $loading}
loading..
{/if}
<Router>
{#if $user}
<Route path="/notes/read/:id" let:params>
<Read id={params.id} />
</Route>
<Route path="/notes/create" component={Create} />
<Route path="/notes" component={Notes} />
<Route path="/folders" component={Folders} />
{:else}
<Route path="/authenticate" component={Authentication} />
{/if}
</Router>
I have tried using useLocation to get the current path. unfortunately since App.svelte isn't a child of the router that doesn't work and the function is returning undefined.
答案1
得分: 0
自 1.4.0 版本以来,svelte-routing
将当前位置导出到脚本中,所以你只需要添加一个导出语句。
<script>
// ...
// 我想要在 !$loading && path="/" 的情况下执行
export let location;
// 然后在这里你可以解析位置
// 并查找第一个 '/' 以确定你所在的路径名。
$: if(!$loading) {
if($user) navigate("/folders");
else navigate("/authenticate");
}
</script>
这是相关的问题链接:https://github.com/EmilTholin/svelte-routing/issues/62
英文:
Since 1.4.0, svelte-routing
has exported the current location into the script, so all you have to do is have an export statement.
<script>
// ...
//i want to do if(!$loading && path="/") below
export let location;
// then here you can parse the location
// and find the first '/' to determine what pathname you are in.
$: if(!$loading) {
if($user) navigate("/folders");
else navigate("/authenticate");
}
</script>
Here is the linked issue: https://github.com/EmilTholin/svelte-routing/issues/62
答案2
得分: 0
我发现在这种情况下,使用window.location.pathname是最直观的解决方案!
$: if (!$loading && path == "/") {
if ($user) navigate("/folders");
else navigate("/authenticate");
}```
<details>
<summary>英文:</summary>
I found using window.location.pathname to be the most intuitive solution in this case!
const path = window.location.pathname;
$: if (!$loading && path == "/") {
if ($user) navigate("/folders");
else navigate("/authenticate");
}
</details>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论