typeScript
-
[typescript] 너는 무슨 타입이니? (keyof 연산자, Record<string, boolean>)프론트엔드 개발자가 될거야./ts 2023. 5. 17. 12:40
- previewImage 상태 변수에서 kyc 값에 따라 이미지를 렌더링하는 기능을 구현할 때 interface IPreviewImage { advanced: string; basic: string; } const [previewImage, setPreviewImage] = useRecoilState(previewImageState); {previewImage[kyc as keyof IPreviewImage] && ( )} IPreviewImage 인터페이스와 previewImage 상태 변수를 사용하여 이미지 미리보기를 구현하는 부분이다. IPreviewImage 인터페이스는 advanced와 basic 두 개의 속성을 갖고 있고 previewImage 상태 변수는 useRecoilState 훅을 사..
-
[이미지 업로드, 이미지 프리뷰] FileReader객체란? reader.onload 함수란? (feat. chatGPT 너 진짜 똑똑하다..)프론트엔드 개발자가 될거야./react 2023. 2. 16. 18:09
이미지를 업로드하고 그 업로드 한 이미지를 프리뷰하는 기능을 구현하고 있다. const [previewImage, setPreviewImage] = useState(""); const [file, setFile] = useState(null); const inputRef = useRef(null); const handleImageUpload = (e: React.ChangeEvent) => { const selectedFile = e.target.files?.[0]; if (selectedFile) { if (selectedFile?.size > MAX_FILE_SIZE) { alert("파일 크기가 너무 큽니다."); return; } const reader = new FileReader(); read..