首先,你要去安装一个工具 tiff.js
npm i tiff.js --save
主要思路就是通过tiff.js 将tiff 文件转换成base64(png),再把base64 转换成file 对象 进行上传;
<template>
<div>
<el-upload
class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/"
:before-upload="uploadFile"
list-type="picture"
>
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
</div>
</template>
<script>
import Tiff from "tiff.js";
export default {
methods: {
uploadFile(file) {
var _this = this;
if (file.type !== "image/tiff") {
return file;
}
return new Promise((resolve, reject) => {
let arr = file.name.split(".");
arr.pop();
let name = arr.join("") + ".png";
let fr = new FileReader();
fr.onload = function(e) {
try {
var image = new Tiff({ buffer: e.target.result });
file = _this.dataURLtoFile(image.toDataURL(), name);
resolve(file);
} catch (error) {
echo(error);
_this.$notify({
title: error.name,
type: "error",
message: error.message
});
reject();
}
};
fr.readAsArrayBuffer(file);
});
},
/**
* 将base64转换为文件
* 此段代码来源于:https://www.cnblogs.com/fps2tao/p/9268613.html
*/
dataURLtoFile(dataurl, filename) {
var arr = dataurl.split(","),
mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]),
n = bstr.length,
u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new File([u8arr], filename, { type: mime });
}
}
};
</script>
