인프런 커뮤니티 질문&답변
formdata
작성
·
488
0
const PostForm = () => {
const { imagePaths, addPostDone } = useSelector((state) => state.post);
const dispatch = useDispatch();
const [text, onChangeText, setText] = useInput('');
useEffect(() => {
if (addPostDone) {
setText('');
}
}, [addPostDone]);
const onSubmit = useCallback(() => {
if (!text || !text.trim()) {
return alert('게시글을 작성하세요.');
}
const formData = new FormData();
imagePaths.forEach((p) => {
formData.append('image', p);
});
formData.append("name", "contentUpload");
console.log(formData);
}, [text, imagePaths]);
const imageInput = useRef();
const onClickImageUpload = useCallback(() => {
imageInput.current.click();
}, [imageInput.current]);
const onChangeImages = useCallback((e) => {
console.log('images', e.target.files);
const imageFormData = new FormData();
[].forEach.call(e.target.files, (f) => {
imageFormData.append('image', f);
});
imageFormData.append("name", "imageUpload");
console.log(imageFormData);
dispatch({
type: UPLOAD_IMAGES_REQUEST,
data: imageFormData,
});
}, []);
form data에서 이런식으로 값을 console에 찍어봤는데 안나오는데
혹시 어디가 잘못된걸까요 ?
답변 1
4
hm_stom
질문자
해결했습니다!
제가 치명적인 실수를 했네요
저와 같은 실수를 하시는분들을 위하여 올릴게요
formData안에 내용물들이 궁금하여 console로 출력 하는 경우에는 빈객체{}가 나옵니다.
이유는, FormData는 XMLHttpRequest를 사용해 전송할 key/value와 같이 쌍을 이뤄 컴파일한 "특수한 객체"이기 때문에, 문자열로 표현할 수 없어서 빈 객체가 나옵니다.
반드시 내용물을 찍어볼 때
"for ...of "를 통하여 내부를 확인하시길 바랍니다!




