naiveUI vue手动上传文件

// 设置手动上传文件的请求 ts文件
import axios from 'axios'
const Storage = createStorage({ storage: localStorage })
// 创建axios实例
const service = axios.create({
  baseURL: import.meta.env.VITE_API_URL as string,
  timeout: 10000
})
// request拦截器
service.interceptors.request.use(
  (config) => {
    // 判断是否有token
    if (window.localStorage.getItem('token')) {
      config.headers = {
        'Content-Type': 'multipart/form-data',  // 核心一,设置请求头
        token:  window.localStorage.getItem('token')
      }
    }
    return config
  },
  (error) => {
    Promise.reject(error)
  }
)
const fileFetch = (method: string, url: string, data: any) => {
  let thisReturnData = <any>''
  if (method === 'post') {
    thisReturnData = service.post(url, data)
  } else if (method === 'get') {
    thisReturnData = service.get(url, {
      params: data
    })
  } else if (method === 'put') {
    thisReturnData = service.put(url, { ...data })
  } else if (method === 'delete') {
    thisReturnData = service.delete(url, {
      params: data
    })
  }
  return thisReturnData
}
export default fileFetch
// 设置api
import { importFile } from '@/api/techFinance/index'
export const uploadFile = (data: object) => fileFetch('post', `请求的地址`, data)
// 文件上传前的限定条件
const beforeUpload: ({ file }: { file: { name: string } }) => Boolean | undefined = ({ file }: { file: { name: string } }) => {
    if (!['csv', 'xls', 'xlsx'].includes(name.substring(name.lastIndexOf('.') + 1))) {
      window.$message.warning('文件格式错误')
      return false
    }
  fileList.value.push(file)
  return false
}

// 调用
  const formdata = new FormData()
  formdata.append('file', fileList.value[0].file)
  uploadFile(formdata)?.then((res) => {
    console.log(res)
    status.value = 2
  })
posted @   Life_countdown  阅读(1575)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)
点击右上角即可分享
微信分享提示