+-
当用户直接导航到页面时,将默认状态传递给链接

在我的GatsbyJs应用程序中,我通过<Link/>组件传递状态中的参数。状态中的此参数告知用户导航到页面后要显示的内容。

<Link
  to={`/${link}`}
  state={{ dataRef: dataToDisplay }}
  key={j}
>
  {heading}
</Link>

这很好用。

但是,当用户直接导航到页面(在地址栏中插入地址)时,我收到错误:TypeError: _this.props.location.state is null,因为状态为空。

我尝试了什么:

在我的page组件上,我试图以下列形式将default value传递给this.props.location.state

const { state = { dataRef: "foo" }} = this.props.location;

但是,这也没有工作并返回相同的错误。所以我的问题是,如何在状态中设置默认的dataRef属性,以便当用户直接在地址栏中键入页面地址时,页面会加载默认参数。

谢谢

1
投票
const { state = { dataRef: "foo" }} = this.props.location;

如果stateundefined,这将有效,但因为它是null它仍然是null。你尝试过这样的事吗?

const state = this.props.location.state || { dataRef: "foo" }