props
-
๐ React ๊ณต๋ถํ๊ธฐ | component ๋ง๋ค๊ธฐ, props์ state ๊ฐ๋ ๋ฆฌ์กํธ 2020. 11. 25. 22:00
ํจ์ํ ์ปดํฌ๋ํธ vs ํด๋์ค ์ปดํฌ๋ํธ ์ปดํฌ๋ํธ๋ ์๋ฐ์คํฌ๋ฆฝํธ์ ํจ์์ฒ๋ผ ํ๋์ ๊ธฐ๋ฅ์ ํ๋ ๋จ์๋ผ๊ณ ์๊ฐํ๋ฉด ๋ ๊ฒ ๊ฐ๋ค. ํ๋์ ์ปดํฌ๋ํธ๋ ํ๋์ ์ปค์คํ ํ๊ทธ์ ์ญํ ์ ํ๋ค. ์ปดํฌ๋ํธ๋ ํจ์ํ์ผ๋ก, ํด๋์คํ์ผ๋ก ์์ฑํ ์ ์๋ค. ํจ์ํ ์ปดํฌ๋ํธ ํจ์ ์ปดํฌ๋ํธ๋ก ํ๊ทธ๋ฅผ ๋ง๋ค์๋ค. ์ด ์ปดํฌ๋ํธ๋ index.js์์ ์ฌ์ฉํ๊ณ ์๊ณ , ๋ก name์ด๋ผ๋ props๋ฅผ ๋๊ฒจ์ฃผ๊ณ ์๋ค. props๋ฅผ ๋ฐ๊ธฐ ์ํด์๋ App์์ props๋ฅผ ์ธ์๋ก ๋ฐ์์ผํ๋ค. ํด๋์ค ์ปดํฌ๋ํธ ES6 class๋ฅผ ์ฌ์ฉํ์ฌ ์ปดํฌ๋ํธ๋ฅผ ์ ์ํ ์๋ ์๋ค. ์ด๋ป๊ฒ Hello, wow๊ฐ ํ๋ฉด์ ๋ ๋๋ง ๋๊ฒ ๋๋ ๊ฒ์ผ๊น? 1. ์๋ฆฌ๋จผํธ๋ก ReactDOM.render()๋ฅผ ํธ์ถํ๊ฒ ๋๋ค. 2. React๋ {name : "wow"} ๋ฅผ props๋ก ..