My backend schema for portfolio is array of type String that contains the path of the images.
I even tried:
portfolio: {
type: [String],
},
gave same result.
and its response looks something like this (notice it's array of paths)
this is how my axios.get looks like,
if i use the responseType: blob, it gives back object like this
this is affecting the my process of displaying array of paths that i have, convert them into blob to be able to display them on frontend
even though i tried to manually convert the blobs into array again (the for loop in my code), it looks like this now, but still unable to load the files
this is how they look like on frontend

UPDATE
tried with fetch request instead of Axios but instead the response looked something like this
and the blob: is basically merged blob of the three images that I have under portfolio, which is definitely not what i want, i want a blob of the three images separately
First of all store the images in the server public directory which you can access via the public URL of that image. Then you send the path of the image relative to the public directory of your server. After getting the response from the server to via Axios just put the URL in the src of the image tag.
For example, suppose your server's public directory is /public and you store an image in it named image.png. Your Axios request must return the response like portfolio:["/image.png", ...]. So just put the image url in the tag it will works fine.