반응형
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
Tags
- 정보처리기사요약
- 오라클
- 코딩테스트
- 정보처리기사실기정리
- react
- 이안의평일코딩
- 국비코딩
- 리액트
- VUE
- Java의정석
- Oracle
- 자바의정석
- 국비IT
- 자스코테
- javascript
- CSS
- spring
- 정보처리기사정리
- 리액트네이티브
- 자바스크립트 코딩테스트
- typescript
- 정보처리기사실기요약
- 자바스크립트
- 타입스크립트
- ReactNative
- php
- 스프링
- 평일코딩
- 정보처리기사
- 정보처리기사실기
Archives
- Today
- Total
목록Vue 이미지 업로드 (1)
이안의 평일코딩
[Vue] 이미지 업로드 및 불러오기
이미지 업로드한 것을 HTML에 보여주려면 두가지 방법이 있다. FileReader() : 파일을 글자로 변환해준다. URL.createObjectURL() : 이미지의 가상 URL을 생성해준다. (다만 새로고침하면 사라진다.) => background-image속성으로 집어넣으면 된다. multiple을 넣으면 다수의 파일을 선택할 수 있다. accept="image/*"를 넣으면 이미지 파일을 가져올 수 있게 기본으로 설정된다. var file = e.target.files; file[0].type과 같이 자바스크립트에서 .type 사용하면 image/png 와 같이 확장자 검사가 가능하다. 조건문을 사용해 일부 확장자만 가능하게끔 설정을 해주면 된다. App.vue URL.createobjectUR..
Front-end/Vue
2021. 5. 14. 16:53