vue3 + vite + setup语法糖使用minIO上传文件

前言：需要使用minio-js插件，原生minio使用vue2框架

npm i minio-js

源码：

minio的部署可参考Windows部署MinIO，搭建本地对象存储服务_minio windows部署-CSDN博客

注意初始化与作为参数中的 bucketName 需要一致，部署本地minio后需要创建bucket

<script setup>
import { ElMessage } from 'element-plus';
import { initMinio, putObject } from 'minio-js'

function handleFiles(event) {
	try {
		var f = event.target.files[0];
		let reader = new FileReader();
		reader.readAsArrayBuffer(f);
		reader.onload = function (e) {
			let res = e.target.result; //ArrayBuffer
			//初始化
			initMinio({
				// endPoint: '192.168.x.xxx',
				endPoint: '127.0.0.1',// minio端点
				port: 9000,
				useSSL: false,
				accessKey: '',
				secretKey: '',
        		bucketName: '',
			});
			//上传,callback是回调函数
			putObject('your bucketName', res, f.name, callback);
		};
	} catch (error) {
		ElMessage({
			showClose: true,
			message: '错误:' + error,
			type: 'error',
			duration: 0,
		});
	}
}

function callback(err, data) {
	if (err) {
		ElMessage({
			showClose: true,
			message: '上传失败,错误:' + err.message,
			type: 'error',
			duration: 0,
		});
	} else {
		ElMessage({
			showClose: true,
			message: '上传成功',
			type: 'success',
		});
	}
}
</script>
<template>
<div>
  <input ref="input" type="file" @change="handleFiles" />
</div>
</template>
<style scoped>

</style>