如何阻止混音在我的 URL 上附加 ?index?

Question

在我的UI上，我有一个页面上的项目列表。我希望用户能够点击竖起大拇指的图像来"喜欢"该项目。

我通过拥有一个将项目 ID 传递给混音操作处理程序的表单来实现了这一点。这工作正常，我可以在我的数据库中记录"喜欢"。我遇到的问题是网址被更改为 ？index。

我已经阅读了这篇文章 https://remix.run/docs/en/v1/guides/routing#what-is-the-index-query-param 但我想停止这种行为。

例：

用户已开启 mysite.com/houses

然后点击像向他们展示的房子一样。

网址将更改为 mysite.com/houses?index

我希望 URL 在"喜欢"操作上保持不变。

Answer 1

使用

解决

const fetcher = useFetcher();

和<fetcher.Form></fetcher.Form>代替<Form></Form>

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

有时，您希望在导航之外调用加载程序，或调用操作(并获取要重新加载的路由)，但您不希望更改 URL。与服务器的许多交互都不是导航事件。此挂钩允许您将 UI 插入操作和加载程序，而无需导航。