element plus 上传文件附件包括请求头的写法

最新推荐文章于 2024-05-19 09:06:12 发布

隐含

最新推荐文章于 2024-05-19 09:06:12 发布

阅读量923

点赞数 2

文章标签：前端

本文链接：https://blog.csdn.net/u010782109/article/details/132067191

版权

 <el-upload
                            v-model:file-list="fileList"
                            class="upload-demo"
                            :action="importUrl"
                            :headers="uploadHeaders"
                             multiple
                             :on-success="uploadSuccess"
                            :on-preview="handlePreview"
                            :on-remove="handleRemove"
                            :before-remove="beforeRemove"
                            :limit="898989"
                            :on-exceed="handleExceed"
                        >
                            <el-button type="primary"><el-icon style="font-size: 22px;"><UploadFilled /></el-icon>&ensp;点击上传文件</el-button>
                            <template #tip>
                            <span class="el-upload__tip">
                                &ensp;&ensp;&ensp;&ensp; 支持扩展名：.rar .zip .doc .docx .pdf .jpg...
                            </span>
                            </template>
                        </el-upload>




import { ElMessage, ElMessageBox } from 'element-plus'

const uploadHeaders = ref({
  Authorization: 'Basic aXdtOml3bV9zZWNyZXQ=',
  'Iwm-Auth':  'bearer ' + cacheTool.getCache('token')
})
const uploadSuccess = (res) => {
 
  console.log(res.data); //上传成功后的参数返回
 
}
const fileurl = ref("/weather_stat/upload_img");
const fileList = ref([])

const handleRemove= (file, uploadFiles) => {
  console.log(file, uploadFiles)
}

const handlePreview = (uploadFile) => {
  console.log(uploadFile)
}

const handleExceed = (files, uploadFiles) => {
  ElMessage.warning(`只能传一张照片！`)
}

const beforeRemove = (uploadFile, uploadFiles) => {
  return ElMessageBox.confirm(
    `Cancel the transfer of ${uploadFile.name} ?`
  ).then(
    () => true,
    () => false
  )
}