【JS學習筆記四】:axios上傳文件

參考:https://juejin.im/post/5cff13ab6fb9a07ee1691e82

  • 首先,在html的input中添加change事件,每次上傳文件(不同名),都會觸發該事件
	<!-- v-on:是vue的事件監聽指令 -->
	<input type="file" v-on:change ="fileUpload($event)"/>
  • 然後,在js中接收事件並調用axios發送formData數據即可

   	fileUpload(e){
   		console.log(e)
   		let file = e.target.files[0]
   		let formData = new FormData()
   		formData.append('file', file)
   		axios.request({
   			url: 'https://www.***.com/robot/api/execl-upload',
   			method: 'post',
   			data: formData
   		}).then(res=>{
   			console.log(res)
   			})
   	}
  • 注:不需要顯示的設置content-type,axios識別到formData會自動刪除content-type,然後瀏覽器會自動設置爲文件上傳屬性
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章