i have inserted an image to database and also i am receiving the image from database to server and to reactjs but in my react i am receiving it has binary data. but how do i convert the binary data to image in react.
JavaScript
x
43
43
1
class Pre extends React.Component{
2
constructor(props){
3
super(props);
4
this.state={
5
post:[]
6
};
7
8
}
9
10
11
componentDidMount(){
12
let self = this;
13
axios.get('http://localhost:8080/images')
14
.then(function(data) {
15
//console.log(data);
16
self.setState({post:data.data});
17
});
18
}
19
20
21
render(){
22
23
console.log(this.state.post);
24
return(
25
<div className="w3-container">
26
27
28
<p className="addboard"> <Link className="linkpre" to="/createstudent I">
29
<button className="addbutton" type="button"><h1>+</h1></button></Link></p>
30
31
32
{this.state.post}
33
34
)}
35
)}
36
37
</div>
38
39
);
40
}
41
}
42
export default Pre;
43
Advertisement
Answer
Converting binary data into image is not related to ReactJS
, If you have the binary data then convert it into image like this:
JavaScript
1
2
1
<img src={`data:image/jpeg;base64,${binary_data}`} />
2