vue 에 서 는 iview 에서 upload 로 사진 을 업로드 하여 표시 합 니 다.
Col(span='24')
FormItem(label="Photos & Videos")
Upload(
multiple
ype="drag"
action="//jsonplaceholder.typicode.com/posts/"
:before-upload='handlePhotoSuccess'
)
div(style="padding: 20px 0")
Icon(type="ios-cloud-upload" size="52" style="color: #3399ff")
p Add file
구성 요소 에서 정 의 된 데이터 대상:
data() {
return {
formData: {
imgRourse: ''
}
}
}
핵심 방법:
handlePhotoSuccess (file) {
this.file.push(file)
console.log(this.file)
this.handlePreview()
return false
},
handlePreview () {
const self = this
const reader = new FileReader()
reader.readAsArrayBuffer(this.file[0])
reader.onload = function (e) {
const bf = this.result
const blob = new Blob([bf], { type: 'text/plain' })
const str = URL.createObjectURL(blob)
self.formData.imgRourse = str
}
},
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Vue Render 함수로 DOM 노드 코드 인스턴스 만들기render에서createElement 함수를 사용하여 DOM 노드를 만드는 것은 직관적이지 않지만 일부 독립 구성 요소의 디자인에서 특수한 수요를 충족시킬 수 있습니다.간단한 렌더링 예는 다음과 같습니다. 또한 v...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.