我的React应用程序具有带有以下搜索过滤器功能的react-router v4：
filterList = (e) => {
let { value } = e.target;
this.setState({ value }, () => {
var searchValue = this.state.value.toLowerCase();
var updatedList = this.state.holder;
updatedList = updatedList.filter((item) => {
return Object.keys(item).some(key => item[key].toString().toLowerCase().search(searchValue) !== -1);
});
this.setState({ books: updatedList });
});
}
当我编辑时，它将转到编辑页面。编辑完成后，它会返回，我如何将剩余的搜索结果返回？
您可以使用react-router中的Link组件并将其指定to={}为对象，并在其中指定路径名作为要到达的路由。然后添加一个变量，例如searchResult保存要传递的值。请参见下面的示例。
使用<Link />组件：
<Link
to={{
pathname: "/page",
searchResult: this.state.searchResult
}}
>
使用 history.push()
this.props.history.push({
pathname: '/page',
searchResult: this.state.searchResult
})
使用以上任一选项，您现在都可以searchResult按照页面组件中的以下内容访问位置对象。
render() {
const { searchResult } = this.props.location
return (
// render logic here
)
}
您可以在此处的另一个示例中看到有关如何将值与路线一起传递的示例。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句