1

我的标题中有一个 CategorySearch 框，它通过查询参数将选定的值传递给搜索结果页面。第一次效果很好。

但我希望标题（带搜索框）保留在结果页面上，并允许用户从标题中更改搜索词。但是，如果您更改标题中的搜索词，即使路由更改，结果页面组件也不会使用新的查询参数重新呈现。

如果您更改结果页面上的第二个 CategorySearch 组件，它会更新。一旦它起作用，我计划隐藏这个组件。

我知道我缺少一件来保持组件同步。有任何想法吗？

标头组件

<CategorySearch
   componentId="q"
   categoryField="_type"
   URLParams
   onValueSelected={val => this.props.router.push(`/search?q="${val}"`)}
   ...
/>

结果页面

<CategorySearch
    componentId="q"
    URLParams
    categoryField="_type"
/>

<ResultList
    componentId="result"
    dataField="title"
    pagination={true}
    URLParams
    react={{
      and: [
        'q',
      ],
    }}
    onData={this.renderData}
/>

您可以在下面的这个示例中看到，我首先从主页运行搜索“测试”，这让我进入了带有正确“测试”搜索结果的结果页面。但后来我将标题中的搜索查询更改为“yoga”并按下回车键。它改变了路线，但搜索结果仍然显示为“测试”。

示例：https ://i.stack.imgur.com/VEmLz.gif

在此先感谢您的帮助！

4

1 回答 1

0

从 CategorySearch 和 ResultList 中删除 URLParams 对我有帮助。

希望这对你也有帮助！

于 2019-08-21T14:23:36.640 回答