在将图像上传到服务器之前尝试显示图像预览时出现问题。我正在使用 reactjs。
我的问题是,当我尝试上传图片时,我得到了文件数据,但是当我使用阅读器时,它不返回本地 URL,只显示undefined
这是我尝试关注的主题get-image-preview-before-uploading-in-react
但是当我尝试检查我的图片本地网址时,它会返回undefined
这是我在文件中导入的内容:
import React, {Component} from "react";
import { MDBContainer, MDBRow, MDBCol, MDBBtn, MDBIcon, MDBInput, MDBDropdown, MDBDropdownToggle, MDBDropdownMenu, MDBDropdownItem } from 'mdbreact';
这是我的js:
<p className="text-upload">Front Desain</p>
<input ref="file" type="file" name="front Design" onChange={this.frontDesign}/>
这是我的方法或功能:
frontDesign = (e) =>{
var file = this.refs.file.files[0];
var reader = new FileReader();
var url = reader.readAsDataURL(file);
reader.onloadend = function (e) {
this.setState({
form:{
frontDesign: [reader.result]
}
})
}.bind(this);
console.log("Check Data : ", file)
console.log("Check URL : ", url)
}
这是我的状态:
state ={
form:{
frontDesign: [],
}
}
这是我的代码框:
https://codesandbox.io/s/tender-mclaren-zb1l7?fontsize=14
有人可以帮我解决这个问题吗?