2017-08-10 36 views
1

我有一個可重用的通用日期選擇器組件,用於其他組件。在某些情況下,單個父組件中有多個日期選擇器組件實例。在狀態變化時觸發函數調用

這裏是我的問題:當狀態改變時,如何觸發父組件內部的函數調用?

我認爲給你的實際情況將有助於澄清我想要完成的事情。

請記住,日期選擇器是一個通用組件,因此使用場景有很大不同。

在某些情況下,當用戶點擊選擇日期時,我需要從後端API獲取一些數據。例如,當用戶點擊某個特定日期時,我可能需要檢索用戶日曆中該日期的所有項目。

我試圖保留所有非日期選擇器關注的日期選擇器組件,我認爲這是正確的方式來做到這一點。但是,如上例所示,在某些情況下,日期選擇器內的用戶操作需要觸發對日期選擇器組件外的函數的調用。

我能想到的一種處理方法是將函數作爲道具傳遞給日期選擇器,並在滿足某些條件時調用它。

我想另一種方法可能是檢測父組件中的狀態變化並調用一個函數 - 前提是有一種方法可以在狀態更改時觸發函數調用。

這是可能的,並處理這種情況的好方法?

+1

我不會引入對以某種方式行爲的父組件的依賴。對於日期選取器的例子,作爲一個名爲'onChange'的道具傳入函數。該功能可能由知道日曆項目的第一個父組件實現。 –

+0

謝謝。我猜想在父母身上檢測到狀態變化是一種反模式。 – Sam

回答

1

「是否可以檢測狀態變化並在發生時調用函數?」

從某種意義上說,這正是React在每次更新依賴狀態時觸發新的DOM呈現的原因。正如您已經說過的,我已經看到大多數人通過將自定義更改處理程序傳遞到父組件的日期組件來解決您的困境,該組件會監聽更改並採取適當的操作。

您還可以擁有由組件處理的默認功能,並且應該將函數prop傳遞給它。我會建議這條路由,因爲它使日期組件儘可能地保持爲自定義邏輯,並提供在需要時傳遞自定義功能的能力。

相關問題