Question

我的标题中有一个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}
/>

您可以在下面的示例中看到，我首先从主页运行了搜索“ test”，这使我以正确的“ test”搜索结果进入了结果页面。但是后来我将标题中的搜索查询更改为“ yoga”，然后按Enter。它更改了路线，但搜索结果仍显示“ test”。

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

预先感谢您的帮助！

Answer 1

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

希望这对您也有帮助！

Reactivesearch-从标题查询参数而不更新结果页面

1 个答案: