Reactjs 在Prime React中上载文件时避免使用URL属性的查询
我试图在Prime React中使用Reactjs 在Prime React中上载文件时避免使用URL属性的查询,reactjs,primereact,Reactjs,Primereact,我试图在Prime React中使用fileupload上传一个excel文件,然后将其转换为JSON类型并在正面显示结果。主要的问题是在Prime React中,需要像URL=“./upload”这样的URL作为属性,但在这种情况下,它不需要与后端通信。有什么解决办法吗 <React.Fragment> <FileUpload mode="basic" accept=".xlsx"
fileupload
上传一个excel文件,然后将其转换为JSON类型并在正面显示结果。主要的问题是在Prime React中,需要像URL=“./upload”这样的URL作为属性,但在这种情况下,它不需要与后端通信。有什么解决办法吗
<React.Fragment>
<FileUpload
mode="basic"
accept=".xlsx"
url="./upload"
maxFileSize={1000000}
label="Import"
chooseLabel="Import"
className="p-mr-2 p-d-inline-block"
uploadHandler={readExcel}
auto
chooseLabel="Browse"
/>
</React.Fragment>
const [rowCount, setRowCount] = useState(0);
const [items, setItems] = useState([]);
const readExcel = (event) => {
const file = event.target.files[0];
const promise = new Promise((resolve, reject) => {
const fileReader = new FileReader();
fileReader.readAsArrayBuffer(file);
fileReader.onload = (e) => {
const bufferArray = e.target.result;
const wb = XLSX.read(bufferArray, { type: "buffer" });
const wsname = wb.SheetNames[0];
const ws = wb.Sheets[wsname];
const data = XLSX.utils.sheet_to_json(ws);
resolve(data);
};
fileReader.onerror = (error) => {
reject(error);
};
});
promise.then((d) => {
console.log("check: ", d);
setRowCount(d.length);
setItems(d);
});
};