尝试使用 react-papaparse 逐行流式传输本地文件,但它不起作用 - 我编码正确还是不可能?



我可以使用react-papaparse来解析本地文件触发onFileLoad={this。ok,但是我想流式传输它,所以我尝试了下面的代码,试图在props中传递onStep或step,但它没有触发。文档暗示这是可能的,但我是在这个错误的方式?我想一次处理每一行以防它是一个非常大的文件。谢谢。

import React from 'react';
import { CSVReader } from 'react-papaparse';
const buttonRef = React.createRef();
export default class CSVReader1 extends React.Component {
handleOpenDialog = (e) => {
// Note that the ref is set async, so it might be null at some point
if (buttonRef.current) {
buttonRef.current.open(e);
}
};
handleOnStep = (row) => {
console.log('handleOnComplete---------------------------');
console.log(row);
console.log('---------------------------');
};
handleOnError = (err, file, inputElem, reason) => {
console.log('handleOnError---------------------------');
console.log(err);
console.log('---------------------------');
};
handleOnRemoveFile = (data) => {
console.log('handleOnRemoveFile---------------------------');
console.log(data);
console.log('---------------------------');
};
handleRemoveFile = (e) => {
// Note that the ref is set async, so it might be null at some point
if (buttonRef.current) {
buttonRef.current.removeFile(e);
}
};
render() {
return (
<CSVReader
ref={buttonRef}
onError={this.handleOnError}
onStep={this.handleOnStep}
noClick
noDrag
onRemoveFile={this.handleOnRemoveFile}
>
{({ file }) => (
<div className="form">
<div>
<button className="button" type="button" onClick={this.handleOpenDialog} >Browse file</button>
</div>
<div className="text-input">
{file && file.name}
</div>
<div>
<button className="button button--secondary" onClick={this.handleRemoveFile}>Remove</button>
</div>
</div>
)}
</CSVReader>
);
};
}

如果您定义了stepcomplete处理程序,则不会调用onFileLoad

源线

config?.complete || config?.step
? config.complete
: () => {
if (!onDrop && onFileLoad) {
onFileLoad(data, file);
} else if (onDrop && !onFileLoad) {
onDrop(data, file);
}
}

最新更新