es mi primera pregunta sobre StackOverflow; bastante básico
Estoy estudiando el curso de reacción "Zero to Mastery", y no puedo entender por qué no puedo usar ${} o {} dentro de la fuente de la imagen, me refiero a props.monster.id
import "./card.styles.css"; export const Card = (props) => ( <div className="card-container"> <img src={"https://robohash.org/${props.monster.id}?set=set2"} /> <h1> {props.monster.name} </h1> </div> );y este es su hermano (Perdón por mi forma de pregunta)
import { Card } from "../card/card.component"; import "./card-list.styles.css"; export const CardList = (props) => { return ( <div className="card-list"> {props.monsters.map((monster) => ( <Card key={monster.id} monster={monster} /> ))} </div> ); };<img src={`https://robohash.org/${props.monster.id}?set=set2`} /> reemplace el "" con acentos graves como lo hice en el ejemplo
Debe usar acentos graves en lugar de comillas para concatenar cadenas y variables:
export const Card = (props) => ( <div className="card-container"> <img src={`https://robohash.org/${props.monster.id}?set=set2`} /> <h1>{props.monster.name}</h1> </div> );