React 可以与 URL 字段进行双向绑定吗?
我有一个用 React 编写的数据可视化工具。我想确保页面的 URL 始终引用用户当前正在查看的视图,并且当他们平移和缩放或更改显示设置时,URL 会更新,以便将他们带回到如果他们将来访问它,也会看到同样的景色。
(Google 地图的工作原理是这样的;当您平移和缩放 URL 中的坐标时,URL 中的坐标会更新为指向您当前正在查看的位置。)
React 有像 React Router 这样的工具来访问 URL 路径组件和查询参数,但它们似乎大多是围绕普通的多路由单页应用程序设计。您可能到不同的路线,但您并不意味着每次更改下拉列表、在文本框中键入字符或拖动平移时都会到达不同的路线某物。如果这样做,创建的历史条目数量将难以管理。
React 中是否有任何东西可以用于双向绑定页面状态字段和 URL 中的字段,以便 React 为我保持它们同步?我希望能够在与应用程序交互的过程中,将 URL 复制粘贴到新的浏览器窗口中,并至少恢复应用程序状态中最重要的部分,即使该状态未映射完全符合“在页面上”的想法。
I have a data visualization tool written with React. I want to make sure that the URL for the page always refers to the view that the user is currently looking at, and that when they e.g. pan and zoom, or change display settings, the URL is updated so that it will take them back to the same view if they visit it in the future.
(Google Maps works like this; as you pan and zoom the coordinates in the URL get updated to point to where you are currently looking.)
React has tools like React Router to access URL path components and query parameters, but they seem mostly to be designed around a normal multi-route single-page application. You might <Link>
to a different route, but you aren't meant to end up at a different route every time you change a dropdown, or type a character in a textbox, or drag to pan something. If you did, the number of history entries created would be unmanageable.
Is there anything in React that can be used to two-way bind page state fields and fields in the URL, so that React will keep them in sync for me? I want to be able to, in the middle of interacting with my application, copy-paste the URL into a new browser window, and have at least the most important parts of my application state be restored, even when that state doesn't map cleanly to the idea of being "on a page".
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论