作者usagi719 (AztecBunny)
看板Ajax
標題[問題] React數據流的問題
時間Mon Jun 6 22:07:18 2022
我知道React數據更新是父組件的state改變，
所有子組件都會重新render，
現在父組件上有一個簡單的開關，
點一下紅色再點一下變綠色這種，
1.以前用class在所有子組件上，
寫shouldComponentUpdate停止子組件因此重新render，
現在改用hook要怎麼寫？
2.接著我嘗試了Redux統一所有state在store裡，
那麼這個小開關的state，我該分開用hook嗎？
還是不論大小所有組件的state都放在store裡？
3.現在我又嘗試了ReduxToolkit + React-Redux，
以前用connect獲取store的state跟dispatch action出去，
現在改用useSelector跟useDispatch了，這兩個可以理解redux的hook版？
那又是相同的問題...
就是怎麼讓，只有改變相關數據的父組件更新，沒改變的子組件不用更新render
總結來說，我遇到的問題來源就是
class未來要逐步被淘汰了？那以往寫在class裡面的生命週期函數要怎麼處理？
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 118.161.37.11 (臺灣)
※ 文章網址: https://webptt.com/m.aspx?n=bbs/Ajax/M.1654524440.A.35B.html
1F：→ brianwu1201: 1. 關鍵字：React.memo 06/07 06:31
2F：→ brianwu1201: 2. 只在這個元件作用的 state 沒有放到 global state 06/07 06:37
3F：→ brianwu1201: (Redux) 的必要 06/07 06:37
4F：→ brianwu1201: 3. 沒有無腦放global state 的話，就不會有這個問題 06/07 06:38
6F：→ jobintan: 可以參考下，當初入坑react也是class component，也有遇 06/22 11:46
7F：→ jobintan: 到要將class life cyele用function hooks重構的事。 06/22 11:47
8F：→ jobintan: 話說Redux global state真的超好用的，如果有遇到需要 06/22 11:49
9F：→ jobintan: 跨組件傳遞state的話，就知道好用了。 06/22 11:50
10F：推 b85040312: hook 的話何不用 useContext 06/22 15:35