gpt4 book ai didi

javascript - 函数未定义,但已定义。 react 和Javascript

转载 作者:行者123 更新时间:2023-11-30 19:19:31 25 4
gpt4 key购买 nike

我有 PhotoUploader 类:

import React from 'react';

class PhotoUploader extends React.Component {
constructor(props) {
super(props);
this.state = {}
this.handleFileSelect = this.handleFileSelect.bind(this);
}

handleFileSelect(evt) {
var file = evt.target.files; // FileList object
// Loop through the FileList and render image files as thumbnails.
for (var i = 0, f; f = files[i]; i++) {
// Only process image files.
if (!f.type.match('image.*')) {
alert("Image only please....");
}
var reader = new FileReader();
// Closure to capture the file information.
reader.onload = (function (theFile) {
return function (e) {
// Render thumbnail.
var span = document.createElement('span');
span.innerHTML = ['<img class="thumb" title="', escape(theFile.name), '" src="', e.target.result, '" />'].join('');
document.getElementById('output').insertBefore(span, null);
};
})(f);
// Read in the image file as a data URL.
reader.readAsDataURL(f);
}
}

componentDidMount() {
document.getElementById('fileMulti1').addEventListener('change', handleFileSelect, false);
}

render() {
return (
<div class="container">
<div class="row">
<label>Мультизагрузка файлов:</label>
<input type="file" id="fileMulti1" name="fileMulti[]" multiple />
</div>
<div class="row">
<span id="outputMulti"></span>
</div>
</div>
);
}
}

export default PhotoUploader;

我遇到了麻烦:在 ComponentDidMount 中,我尝试 addEventListener 以输入名为“fileMulti1”的文件。开始后我得到“ReferenceError: handleFileSelect is not defined”

最佳答案

我认为您在引用函数时忘记在 addEventListener 中使用 this:

document.getElementById('fileMulti1').addEventListener('change', this.handleFileSelect, false);

关于javascript - 函数未定义,但已定义。 react 和Javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57628694/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com