我試圖使用打字稿創建一個上傳按鈕,這是我的代碼
import React, {useState} from 'react';
function FileUploadPage(){
const [selectedFile, setSelectedFile] = useState();
const [isFilePicked, setIsFilePicked] = useState(false);
const changeHandler = (event) => {
setSelectedFile(event.target.files[0]);
setIsSelected(true);
};
const handleSubmission = () => {
const formData = new FormData();
formData.append('File', selectedFile);
fetch(
'https://freeimage.host/api/1/upload?key=<YOUR_API_KEY>',
{
method: 'POST',
body: formData,
}
)
.then((response) => response.json())
.then((result) => {
console.log('Success:', result);
})
.catch((error) => {
console.error('Error:', error);
});
};
};
return(
<div>
<input type="file" name="file" onChange={changeHandler} />
{
isSelected ? (
<div>
<p>Filename: {selectedFile.name}</p>
<p>Filetype: {selectedFile.type}</p>
<p>Size in bytes: {selectedFile.size}</p>
<p>
lastModifiedDate:{' '}
{selectedFile.lastModifiedDate.toLocaleDateString()}
</p>
</div>
) : (
<p>Select a file to show details</p>
)}
<div>
<button onClick={handleSubmission}>Submit</button>
</div>
</div>
) }
我在“formData.append('File', selectedFile);”這一行出現錯誤。由于我是新手,我不知道這個錯誤是什么意思。這個錯誤說“'undefined'型別的引數不能分配給'string | Blob'型別的引數”,我附上了錯誤圖片,有人幫我解決這個錯誤。
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/433060.html
上一篇:打字稿型別級別過濾
