从子路由提交的父路由上的Action Loader函数重定向回到父路由

发布于 2025-02-07 16:06:42 字数 438 浏览 3 评论 0原文

因此,我正在努力努力,我敢肯定,我缺少一个优雅的解决方案。我有一个嵌套的路由系统,其中父/data/creams(绿色)的项目列表在其上有操作表格以及操作加载程序的位置。但是,这些可以从子路由/data/data/$ streamId(紫色)提交。所有操作都可以正常工作,除非用户在儿童路线上,否则将其重定向回父母。我可以用重定向来解决此问题,并将当前位置嵌入小暂停表单中,但是当呼叫失败时,我无法使用useactiondata显示错误通知。

So I am struggling with something that I am sure has an elegant solution that I am missing. I have a nested route system where the parent /data/streams (green) has a list of items that have action forms on them and where the action loader is located. However, these can be submitted from a child route /data/streams/$streamId (purple). All works fine except if the user is on a child route they are redirected back to the parent. I can kind of solve this with redirect and embedding the current location in the small pause form, but then I can't use useActionData for displaying error notifications when a call fails.
enter image description here

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

地狱即天堂 2025-02-14 16:06:42

混音将< form>提交为导航(标准浏览器功能)。这就是为什么您的子路由帖子正在导航到父路线的原因(因为您要发布到的地方)。

混音还支持不是导航(标准获取)的表单。为此,请使用< fetcher.form>。注意:从操作返回的数据可在fetcher.data上获得。还要检查fetcher.statefetcher.submission以处理乐观的UI。

const fetcher = useFetcher()
return <fetcher.Form method="post" action="/data/streams">

https://remix.run/docs/docs/docs/en/en/en/v1/api/api/remix## Usefetcher

Remix treats <Form> submissions as navigations (standard browser feature). That is why your child route POST is navigating to the parent route (since that's where you're posting to).

Remix also supports form submissions that are not navigations (standard fetch). To do this, use <fetcher.Form>. NOTE: data returned from the action is available on fetcher.data. Also check fetcher.state and fetcher.submission to handle optimistic UI.

const fetcher = useFetcher()
return <fetcher.Form method="post" action="/data/streams">

https://remix.run/docs/en/v1/api/remix#usefetcher

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文