傳遞來自兩個獨立組件的數據reactjs

Question

我有一個父級div，它擁有我的應用程序的所有組件。

在搜索欄，我有兩個組成部分。搜索輸入和過濾器。 當用戶進入搜索框或者選中複選框時，我需要更新填充所需的數據，然後執行一次服務調用來傳遞這些數據。現在，我的問題是：

1. 我在哪裏需要創建服務調用所需的數據對象？

2. 如何更新創建的特定對象，以便當用戶在搜索輸入中輸入某些內容或者選中/取消選中該複選框時，該對象需要相應更新，並觸發服務調用？

物體看起來是這樣的：

{ 「術語」： 「用戶輸入的搜索詞」， 「過濾器」：[ { 「名」： 「FILTER1」， 「值」：[ 「CHECKBOX1」，...] }，{ 「名稱」： 「FILTER2」， 「值」：[ 「CHECKBOX2」 .....] } ] }

Answer 1

1. 將狀態保持在SearchBar中。在那裏，爲每個複選框保留狀態併爲搜索框指定狀態。

2. 從SearchBar中，將回調函數作爲道具給搜索框組件和複選框組件。因此，當搜索框的值發生變化時（使用onchange事件），您將觸發回調，然後啓動服務調用，然後更新狀態。