反应路由器,以编程方式导航时传递数据?

尤金:

我们可以使用以下方法导航到不同的路径

this.props.router.push('/some/path')

导航时是否可以发送参数(对象)?

我还有其他选择,但想知道是否object完全可以通过

  • 我可以嵌入对象的ID并从服务器的新页面重新获取对象。

  • 或者,我可以将对象存储在全局存储(如redux存储)中。(此对象需要尽快从商店中删除。因此,我认为将其放在第一位可能不好。)

保罗·S:

React Router使用location对象。location对象的属性之一state

this.props.router.push({
  pathname: '/other-page',
  state: {
    id: 7,
    color: 'green'
  }
})

在导航到的页面上,电流location将注入到其路线匹配的组件中,因此您可以使用来访问状态this.props.location.state

要记住的一件事是,state如果用户直接导航到页面将不会有任何内容,因此,当数据不存在时,您仍然需要某种机制来加载数据。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

AngularJS-UI路由器-以编程方式添加状态

多步骤反应路由器导航

以编程方式反应路由器v4导航

Angular Ui路由器-以编程方式设置父级

导航时如何防止NavBar菜单重新呈现?反应路由器v4

Vue路由器编程导航不起作用

选择反应本机路由器通量或反应路由器本机或反应导航的哪一个

从导航堆栈反应本机路由器流量重置场景

反应路由器通过数据

反应路由器传递道具以路由组件

Vue路由器:通过路径以编程方式重定向时,可以传递参数吗?

如何以编程方式更改路由器路径?

使用路由器传递数据

反应路由器中组件的不同导航栏

根据路线反应路由器导航栏

反应路由器:将此this.props.location传递给导航栏组件

反应路由器:无法导航路线

反应路由器 4 在路由中传递参数

在没有反应路由器的情况下以编程方式重定向到 URL

反应路由器从 API 获取数据

在反应路由器中传递参数的安全方式

通过路由器“组件”属性传递值道具时反应输入失去焦点

几次导航后反应路由器 dom 白屏

使用反应路由器从主页重定向到特定页面后访问从 NavLink 传递的数据

带钩子的反应路由器 - 无法导航到屏幕

导航到当前页面时反应路由器滚动到顶部

如何使用反应路由器基于状态导航

页面导航后反应路由器链接仍然存在

在反应路由器dom中使用导航时,函数作为反应子错误无效