vue3实现上传功能

效果：

 

 点击即可上传

代码：

const uploadFile = (file) => {
 let formData = new FormData();
  formData.append("file", file.file);
  const uid=file.file.uid
     uploadAPI(formData).then((res) => {
    imgLoding.value=false
    message.success("上传成功");
    filesList.value.push({...res,uid})
  });
};

export function uploadAPI (params) {
  return request({
    method: 'post',
    url: uploadApi+'/api/app/file-address/upload-file',
    data:params,
    headers: {
      'Content-Type': 'multipart/form-data'
    }
  })
}

 

function  preview (file) {
      changeInputVal.value = {...file}
      previewVisibleName.value = true
    }

const remove=(file,actions)=>{
actions.remove()
filesList.value = filesList.value.filter(item => item.uid !== file.uid);
}