一、文件上傳
步驟:將文件通過接口轉換為地址給后臺
怎么將文件給后臺?
// uploadFile el文件上傳組件自定義的方法(http-request)
async uploadFile(files) {
// files文件
const { file } = files
const { name, uid } = file
let form = new FormData()
form.append('WenJianID', uid)
form.append('files', file)
//將文件傳給后臺 form包含文件的入參
const res = await WenJianCC(form)
}
FormData 對象的使用:
1----用一些鍵值對來模擬一系列表單控件:即把form中所有表單元素的
name與value組裝成一個queryString。2----異步上傳二進制文件。
二、原生draggen使用
需求是拽元素并放置在input框里。
思路,獲取拖拽元素的數據,拼接到輸入框光標后面
// 拖拽元素
// 將元素設置為可拖拽元素
:draggable="true"
// 拖拽完成觸發事件
@dragend="draggableEnd()"
// 放置位置元素
// 放置位置設置 一定要阻止默認事件
@dragover.prevent.native="() => {}"
// 放置觸發事件
@drop.prevent.native="downDrop()"
// input光標獲取
@blur="blurEvent"
blurEvent(e) {
this.blurIndex = e.srcElement.selectionStart
},