JSX - Syntax for creating a dynamic link when trying to load images from a database stored in state array

Question

I'm basically trying to have a dynamic ending on a link, with the link ending coming from state array that was created with fetching information from a database.

I'm using map to go through all the items on the array and I'm trying to render thumbnails of all the images in the array. However, I'm not quite sure how the syntax works in JSX.

I've already tried injecting javascript and tried bracketing it from various places but haven't found a solution.

{picArr.thumbnails.w160}

Contains the tokens for the thumbnails to be reached.

<img src='http://media.rr.randomexample.com/wbma/media/' {picArr.thumbnails.w160} alt={picArr.title} />

Answer 1

Have you tried this?

<img
  src={'http://media.rr.randomexample.com/wbma/media/' + picArr.thumbnails.w160}
  alt={picArr.title}
/>