Question

我使用以下代码来从文件上传（XML）中获取值。但是控制台输出始终是不确定的。

有人会指出我的错误吗？

我的JS代码：

export default function XYZ() {
     ...
     const [xmlUpload, setXmlUpload] = useState(null);

    function uploadXMLHandler(e) {
        setXmlUpload(e.target.files[0]);
    }

    useEffect(() => {
        if (xmlUpload != null) {
            var convert = require('xml-js');
            var fileReader = new FileReader();
            var result =  fileReader.readAsText(xmlUpload);   
            console.log(result);
        }
    });


...

我的HTML代码是

  <div className="uploadXML">
            <input type="file" onChange={uploadXMLHandler} />
        </div>

Answer 1

您使用的FileReader错误。 FileReader#readAsText不会立即返回结果，而是开始异步读取。完成后，它将触发load事件。因此，您应该像这样监听事件：

var fileReader = new FileReader();
fileReader.onload = () => console.log(fileReader.result);
var result =  fileReader.readAsText(xmlUpload);

反应useState-文件阅读器未更新

1 个答案: