The Old County
The Old County

Reputation: 89

reactjs - how to render images from a json blob

I am new to reactjs and I am pushing json data into a react component. I've tried to add cost image = require(json.image) inside the loop, but its not a valid procedure. Require doesn't metabolise the dynamic path -- and import is not valid at the child level

Upvotes: 2

Views: 7825

Answers (1)

mrinalmech
mrinalmech

Reputation: 2155

Store the json in the state or a prop and then use it to render the image

const image = new Image();
image.src = URL.createObjectURL(json.image);

EDIT: If json.image is file data then you have to convert to a blob

var binaryData = []; 
binaryData.push(data); 
image.src = URL.createObjectURL(new Blob(binaryData, {type: "application/zip"}))" 

Upvotes: 4

Related Questions