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.
class Pre extends React.Component{ constructor(props){ super(props); this.state={ post:[] }; } componentDidMount(){ let self = this; axios.get('http://localhost:8080/images') .then(function(data) { //console.log(data); self.setState({post:data.data}); }); } render(){ console.log(this.state.post); return( <div className="w3-container"> <p className="addboard"> <Link className="linkpre" to="/createstudent I"> <button className="addbutton" type="button"><h1>+</h1></button></Link></p> {this.state.post} )} )} </div> ); } } export default Pre;
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:
<img src={`data:image/jpeg;base64,${binary_data}`} />