在React中，尝试根据传递给url的In显示不同的图像。

Question

根据传入url的机器人id，网页上的机器人图像应该是不同的，但是网页显示所有相同的机器人图像。下面显示了React JS代码的一部分。

import React from 'react';

const Card = ({name, email, id}) => {
return (
    <div className='tc bg-light-green dib br3 pa3 ma2 grow bw2 shadow-5'>
        <img alt='robots' src={'https://robohash.org/${id}&200x200'} />
        <div>
            <h2>{name}</h2>
            <p>{email}</p>
        </div>
    </div>
);
}

export default Card;

显然，这个问题出现在src={'https://robohash.org/${id}&200x200'}上。请帮助如何设置src部分。谢谢。

Answer 1

你必须在这里使用反勾，而不是单引号。通过将单引号改为反勾号来检查，然后查看src的格式是否正确

<img alt='robots' src={`https://robohash.org/${id}&200x200`} />