更新 url 查询时页面道具不更新答案

【问题标题】：Page props do not update when url query is updated更新 url 查询时页面道具不更新
【发布时间】：2017-09-08 03:03:30
【问题描述】：

我正在使用 Gatsby 1.4.0

我希望网站上有多个链接到同一页面但搜索查询不同的按钮。例如，虚拟页面中的 2 个按钮。：

Link A -> Routes to '/test/?name=john
Link B -> Routes to '/test/?name=peter

我想使用 from 'gatsby-link' 将用户路由到新路径，这样页面就不会刷新。

问题

导航时，我的布局文件按预期重新呈现，但我的页面文件没有重新呈现。只有当我重新加载页面时，正确的查询才会传递到我的页面文件。

layout/index.js 文件（简化）：

render() {
    console.log(this.props.location.search) // Correct query every time navigation occurs
    return (
      <div>
        {this.props.children()}
        <Footer />
      </div>
    )
  },

pages/test.js

import React from 'react'
import Link from 'gatsby-link'

export default class Dummy extends React.Component {

  render() {
    console.log(this.props.location.search) // Does not re-render on navigation.

    return (
      <div>
        <Link to="/test/?name=john">John</Link>
        <Link to="/test/?name=peter">Peter</Link>
      </div>
    )
  }
}

有没有办法在查询更新时强制页面重新呈现？

【问题讨论】：

标签： gatsby

【解决方案1】：

跳过链接中的最后一个 / 会起作用，所以它是：

<Link to="/test?name=john">John</Link>
<Link to="/test?name=peter">Peter</Link>

【讨论】：