传递来自两个独立组件的数据reactjs

Question

我有一个父级div，它拥有我的应用程序的所有组件。

在搜索栏，我有两个组成部分。搜索输入和过滤器。 当用户进入搜索框或者选中复选框时，我需要更新填充所需的数据，然后执行一次服务调用来传递这些数据。现在，我的问题是：

1. 我在哪里需要创建服务调用所需的数据对象？

2. 如何更新创建的特定对象，以便当用户在搜索输入中输入某些内容或者选中/取消选中该复选框时，该对象需要相应更新，并触发服务调用？

物体看起来是这样的：

{ “术语”： “用户输入的搜索词”， “过滤器”：[ { “名”： “FILTER1”， “值”：[ “CHECKBOX1”，...] }，{ “名称”： “FILTER2”， “值”：[ “CHECKBOX2” .....] } ] }

Answer 1

1. 将状态保持在SearchBar中。在那里，为每个复选框保留状态并为搜索框指定状态。

2. 从SearchBar中，将回调函数作为道具给搜索框组件和复选框组件。因此，当搜索框的值发生变化时（使用onchange事件），您将触发回调，然后启动服务调用，然后更新状态。