Recibo una matriz como esta desde el backend:
['test.jpg', 'test2.jpg']Lo puse en un estado de reacción llamado imágenes.
Lo que debo hacer es mapearlo, y para cada nombre de imagen en la matriz, crear una imagen con ese nombre como variable en la ruta de esta manera:
{pictures.map((picture) => ( <img className="picture" src={`http:localhost:8000/pictures/${ WHAT DO I NEED TO WRITE HERE ? }/> )))}El primer argumento de la función de mapa se refiere a cada elemento de su matriz, así que asígnele el nombre que desee y obtendrá el elemento de la matriz.
Dado que lo nombró picture , el nombre de cada elemento ahora es picture
Brevemente, puede poner la picture en el espacio como:
{pictures.map((picture) => ( <img className="picture" src={`http:localhost:8000/pictures/${picture}`}/> ))}En este caso, solo necesitaría agregar http:localhost:8000/pictures/${picture}
Por supuesto, esto solo funcionará mientras haya una imagen con un nombre coincidente en el puerto 8000.