| ์ผ | ์ | ํ | ์ | ๋ชฉ | ๊ธ | ํ |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | |||
| 5 | 6 | 7 | 8 | 9 | 10 | 11 |
| 12 | 13 | 14 | 15 | 16 | 17 | 18 |
| 19 | 20 | 21 | 22 | 23 | 24 | 25 |
| 26 | 27 | 28 | 29 | 30 | 31 |
- abap
- ๋ฅ๋ฌ๋
- ์์ฐ์ด์ฒ๋ฆฌ
- ์๋ฐ์คํฌ๋ฆฝํธ
- ์๋ง์กด์น์๋น์ค
- ์ธ๊ณต์ง๋ฅ
- AWS
- sap
- ๋น ๋ฐ์ดํฐ
- ์๊ณ ๋ฆฌ์ฆ
- ์ฝ๋ฉํ ์คํธ
- ํ๋ธ๋ก
- ๋ฐ์ดํฐ๋ถ์
- Git
- ๋ฆฌ์กํธ
- ํ๋ธ๋ฃจ
- ๋ฐฑ์ค
- github
- AI
- ์ฝํ
- ํ์ด์ฌ
- DFS
- ๊นํ๋ธ
- ํ ์คํธ๋ง์ด๋
- erp
- ํ ์คํธ๋ถ์
- tableau
- ๋ฐ์ดํฐ ๋ถ์
- nlp
- react
- Today
- Total
๋ชฉ๋ก๊ฐ์ ํ์ผ ์ฌ๋ฆฌ๊ธฐ (1)
Hey Tech
[React] Input Tag์์ ๊ฐ์ ํ์ผ ์
๋ก๋ํ๋ ๋ฐฉ๋ฒ
๐ ๋ชฉ์ฐจ 1. AS IS: ๋์ผ ํ์ผ ์ ๋ก๋ ๋ถ๊ฐํ ๊ฒฝ์ฐ 2. ํด๊ฒฐ๋ฐฉ๋ฒ 3. TO BE: ๋์ผ ํ์ผ ์ ๋ก๋ ๊ฐ๋ฅํ ๊ฒฝ์ฐ 1. AS IS: ๋์ผ ํ์ผ ์ ๋ก๋ ๋ถ๊ฐํ ๊ฒฝ์ฐ ์๋์ ์์๋ก ์ํฉ์ ์ค๋ช ํด ๋๋ฆฝ๋๋ค(๊ทธ๋ฆผ 1). ํ์ผ ์ ๋ก๋ ์(i.e., onChange) ํ์ ์ด ๋จ๋ ๋ก์ง์ ์์ฑํ์์ต๋๋ค. ํ๋ฐ, ๊ฐ์ ํ์ผ์ ์ ๋ก๋ํ ๊ฒฝ์ฐ ์ดํ ๋ก์ง์ด ์ํ๋์ง ์๋ ๊ฒ์ ํ์ธํ์ค ์ ์์ต๋๋ค. 2. ํด๊ฒฐ๋ฐฉ๋ฒ { this.onFileChange(e); e.target.value = ''; }}/> input ํ๊ทธ์์ onChange ์ต์ ์์ ํ์ผ ์ ๋ก๋ ๋ก์ง ํธ์ถ ํ event์์ value๋ฅผ ์ด๊ธฐํํ๋ฉด ํด๊ฒฐ ๊ฐ๋ฅํฉ๋๋ค. 3. TO BE: ๋์ผ ํ์ผ ์ ๋ก๋ ๊ฐ๋ฅํ ๊ฒฝ์ฐ ์ฝ๋๋ฅผ ์ ์ฉํ๋ฉด ์์ ๊ทธ๋ฆผ 2์ ๊ฐ์ด ๊ฐ์ ํ..