[๋ฆฌ์•กํŠธ] ๋ผ์ดํ”„ ์‚ฌ์ดํด ํ•จ์ˆ˜

[๋ผ์ดํ”„์‚ฌ์ดํด] : ์ปดํฌ๋„ŒํŠธ๊ฐ€ ์ƒ์„ฑ~์—…๋ฐ์ดํŠธ~์ฃฝ๋Š” '์ปดํฌ๋„ŒํŠธ ์ƒ๋ช…์ฃผ๊ธฐ' ๋ Œ๋”๋ง(ํƒ„์ƒ) ··· ์—…๋ฐ์ดํŠธ ··· ์‚ฌ๋ผ์ง€๋Š”๊ฒƒ / ์ƒˆ๋กœ๊ณ ์นจ(์‚ฌ๋ง) '๋ผ์ดํ”„ ์‚ฌ์ดํด ํ•จ์ˆ˜'๋Š” ํด๋ž˜์Šคํ˜• ์ปดํฌ๋„ŒํŠธ์—์„œ๋งŒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค. constructor() : ์ƒ์„ฑ์ž ํ•จ์ˆ˜ props ๋ฐ›์•„์˜ค๊ณ , state์˜ ๊ธฐ๋ณธ๊ฐ’๋„ ์„ค์ •ํ•ด ์ค„์ˆ˜ ์žˆ๋‹ค. ๊ฐ€์žฅ ์ฒ˜์Œ์œผ๋กœ ๋ถˆ๋ ค์˜ค๊ณ , ์–ด๋–ค ์„ค์ •์„ ๋งŒ๋“ค์–ด ์ฃผ๋Š” ์•  constructor(props) { super(props); this.state = { name : "๋ฒ„ํ„ฐํ˜ธ๋‘", }; } render() props์— ์ ‘๊ทผํ•ด์„œ ๋ฐ์ดํ„ฐ๋ฅผ ๋ณด์—ฌ์ฃผ๋Š” ์•  ๋ Œ๋” ๋‹น์‹œ์— ๋ฐ์ดํ„ฐ๋ฅผ ์ˆ˜์ •ํ•˜๋ฉด ์•ˆ๋จ! componentDidMount() ๋งˆ์šดํŠธ(mount) : ์ปดํฌ๋„ŒํŠธ๊ฐ€ ํ™”๋ฉด์— ๋‚˜ํƒ€๋‚œ๋‹ค. ์ฒซ ๋ Œ๋”๊ฐ€ ๋œ ์งํ›„ ํ•œ๋ฒˆ๋งŒ(์ฒซ๋ฒˆ์งธ๋งŒ) ์‹ค..

2021. 4. 13. 15:39