Files 배열안의 .size를 활용하여 15mb이상 일경우의 파일크기를 측정할수 있는 예시.
const FilesSize = () => {
const imageHandleChange = (e) => {
const activeFiles = Array.from(e.target.files);
let toastShow = false;
activeFiles.forEach((el) => {
console.log(el.size);
if (el.size / 1000000 > 15) {
toastShow = true;
}
});
if (toastShow) {
alert("this file is over 15mb");
}
};
return (
<div>
<input
type="file"
accept=".jpg, .png, .jpeg"
multiple
id="file"
hidden
onChange={imageHandleChange}
/>
<div className="label-holder">
<label htmlFor="file" className="label">
<div
style={{
width: "88px",
height: "88px",
backgroundColor: "red",
display: "flex",
justifyContent: "center",
alignItems: "center",
position: "relative",
cursor: "pointer"
}}
>
click
</div>
</label>
</div>
</div>
);
};
export default FilesSize;
'A.개발관련자료' 카테고리의 다른 글
[0]nestjs 페이징 ( take, skip 사용) (0) | 2022.07.18 |
---|---|
[0]increment decrement button (0) | 2022.06.28 |
[0]redux toolkit의 slice내에서 navigate쓸수 없을 때 (비동기) (0) | 2022.06.24 |
[0]react 스크롤시 해당 위치(id)로 이동하기 : <a href = "#tagname"> ,scrollEvent (0) | 2022.06.21 |
[0]클릭시 하단으로 이동 (0) | 2022.05.27 |