如何使用 GetX 包管理 Flutter Web URL 路由？

Posted 2023-02-23

【中文标题】如何使用 GetX 包管理 Flutter Web URL 路由？

【英文标题】：How to manage Flutter web URL routes using the GetX package?

【发布时间】：2021-03-04 05:08:24

【问题描述】：

我正在为 ios、android 和 Web 开发 Flutter 应用程序。我决定使用 GetX 包，因为它使事情变得更容易，但我对如何处理 Web URL/地址栏导航感到困惑。例如，我的一个屏幕显示有关事件的详细信息。在应用程序中导航可以正常工作，但如果我在浏览器中粘贴指向事件的链接怎么办？我的 GetX EventController 管理一个 _selectedEvent 事件，这就是我知道要显示哪个事件的详细信息的方式。但是，如果我使用 URL 链接，我的 _selectedEvent 事件永远不会更新，详细信息屏幕也不会显示正确的事件。

当前，当用户单击事件以导航到详细信息屏幕时，我在主页中设置了_selectedEvent。但是，如果用户在浏览器中浏览地址栏，我无法更新_selectedEvent。我认为我不能使用 GetX 中的任何状态管理器，因为我没有更新小部件，所以我不确定在哪里更新我的 _selectedEvent。

地址栏导航应该如何处理？

希望我的解释是有道理的。我还在努力学习 Flutter。

【参考方案1】：

因此，如果其他人偶然发现这个问题，我找到了一个解决方案。 This link 对 Flutter 的路由和导航有很好的、易于理解的描述和实现。它没有专门使用 GetX 来进行路由，但我只是使用 GetPageRoute 而不是 MaterialPageRoute 和 GetX 导航而不是 Flutter Navigator 仍然受益于 GetX 控制器和绑定。我的浏览器后退按钮仍然有问题，但我认为这是 Flutter 问题，不是我具体项目的问题。

【参考方案2】：

尝试使用带有动态 URL 链接的 GetX 命名路由，如 here 所述。例如，对于特定事件，您可能有一个类似“https://.../events?id=1234”的 URL，您可以在控制器中使用 Get.parameters['id'] 获取 ID 并显示事件基于此 ID 的详细信息。