我是靠谱客的博主 无心草丛,最近开发中收集的这篇文章主要介绍element-ui上传文件element-ui 组件上传文件个人见解,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

element-ui 组件上传文件个人见解

<template>
 <el-upload  
 	action="#"  
 	accept=".xls,.xlsx" 
 	:file-list="fileList" 
 	:limit="1" 
 	:show-file-list="false"  
 	:auto-upload="false" 
 	:on-change="importData">
 	/*
 	属性详解可以去element-ui官网查询
	action:表示文件上传的地址,填写#表示不指定上传网址
	accept:接受的文件类型
	file-list:上传的文件放置位置
	limit:限制上传的数量
	auto-upload:是否自动上传
	on-change:当文件上传时触发函数
	*/
            <el-button >批量導入</el-button>
     </el-upload>
</template>

<script>
data(){
 return {
	fileList:[]
 },
methods:{
 importData (file,fileList) {
 	//file表示当前上传的文件,fileList:表示存放的文件的数组
 	let form = new FormData(); //创建表单文件,存放相关数据,可以存放上传文件
 	form.append('key',data)
 	form.append('file',file.raw) //或者可以form.append('file',fileList[0].raw) 这个仅针对只有一个文件的情况下,即fileList[0]==file
 	 axios.post(`url`, form, {headers: { type:xx },}).then(res => {
     //逻辑处理
   })
  )
 } 
}
</script>

最后

以上就是无心草丛为你收集整理的element-ui上传文件element-ui 组件上传文件个人见解的全部内容,希望文章能够帮你解决element-ui上传文件element-ui 组件上传文件个人见解所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(53)

评论列表共有 0 条评论

立即
投稿
返回
顶部