9์›”7์ผ TIL

์ž„๋ค๋คยท2022๋…„ 9์›” 7์ผ
0

๐Ÿ”ฅ๋ชฉ์ฐจ๐Ÿ”ฅ

1. ๊ธฐ์ˆ ๋ฉด์ ‘ ์งˆ๋ฌธ์— ๋Œ€ํ•œ ์ถ”๊ฐ€์  ๋‹ต๋ณ€ ์ •๋ฆฌ [2ํƒ„]

( ์˜ค๋Š˜์˜ ๊ธฐ๋ถ„ ๐Ÿ˜Š๐Ÿ”ฅ )

๐Ÿง๊ทธ๋ ‡๋‹ค๋ฉด ๊ผฌ!๐Ÿง


๐Ÿ’ก ๋ชจ์˜ ๊ธฐ์ˆ ๋ฉด์ ‘ ์งˆ๋ฌธ 2๋ฒˆ

  • useEffect๋ฅผ class Component์˜ componentDidMount์— ๋น„๊ตํ•ด์„œ ์„ค๋ช… ํ•ด์ฃผ์„ธ์š”
    • ๐Ÿ’ก ๋‚˜์˜๋‹ต๋ณ€
      ์šฐ์„  useEffect๋Š” dependency ๋ฐฐ์—ด ๋‚ด์— ์ง€์ •๋œ ๊ฐ’์˜ ๋ณ€ํ™”๊ฐ€ ์ผ์–ด๋‚ฌ์„๋•Œ ํ•จ์ˆ˜๊ฐ€ ์‹คํ–‰ ๋˜๊ฒŒ๋” ํ•˜๊ณ  ํ•„์š”์— ๋”ฐ๋ผ์„œ๋Š” cleanupํ•จ์ˆ˜๋ฅผ ๋ฐ˜ํ™˜ํ•˜๋„๋ก ์ž‘์„ฑํ•ด์„œ ์ดํŽ™ํŠธ ์‹คํ–‰์ด์ „์— ์‹คํ–‰์‹œํ‚ฌ์ˆ˜ ์žˆ๋Š” React Hook ์ž…๋‹ˆ๋‹ค ๋ฐ˜๋ฉด์— componentDidMount๊ฐ™์€ ๊ฒฝ์šฐ๋Š” ์ปจํฌ๋„ŒํŠธ๊ฐ€ ์ฒซ ๋ Œ๋”๋ง์„ ๋งˆ์น˜๊ณ  ๋‚˜์„œ ์ดํ›„์— ์‹คํ–‰์ด ๋˜๊ฒŒ ๋˜๋Š” LifeCycle์ด๋ผ๋Š” ์ฐจ์ด์ ์„ ๋จผ์ € ์„ค๋ช…์„ ๋“œ๋ ค์•ผ ํ• ๊บผ ๊ฐ™์Šต๋‹ˆ๋‹ค.
      ์ฆ‰ ๋‘˜์„ ๋น„๊ตํ•˜์ž๋ฉด useEffect๋Š” class Component์˜ LifeCycle๊ณผ ์œ ์‚ฌํ•˜๊ฒŒ ๊ตฌํ˜„ํ•˜๊ณ  ์‹ถ์„๋•Œ ์‚ฌ์šฉํ•˜๋Š” Hook์ด๊ณ  ComponentDidMount๋Š” ๋ง ๊ทธ๋Œ€๋กœ LifeCycle์ด๊ธฐ ๋•Œ๋ฌธ์— ํ•˜๋Š”์ผ์ด ๋šœ๋ ทํ•˜๊ณ  Ajax๋‚˜ ํƒ€์ด๋จธ ๋“ฑ์„ ์„ค์ •ํ•˜๋Š” Mathod๋ผ์„œ ๋‘˜์€ ์ž‘๋™ํ•˜๋Š” ๋ชจ์Šต์€ ๋น„์Šทํ• ์ˆ˜์žˆ์œผ๋‚˜ ์—„์—ฐํ•˜๊ฒŒ ๋‹ค๋ฆ…๋‹ˆ๋‹ค

๐Ÿ’ก ์กฐ๊ธˆ๋” ๋‹ค๋“ฌ์–ด๋ณผ ํ•„์š”์„ฑ์ด ์žˆ์Œ :)


profile
์‘์• ๐Ÿฃ ์˜ˆ๋น„ ๊ฐœ๋ฐœ์ž ์ž…๋‹ˆ๋‹ค.

0๊ฐœ์˜ ๋Œ“๊ธ€