ReactJS从数组渲染图像

Question

我试图通过将其名称放在<img>链接的中间来从数组中呈现图像。

此时我的链接用完了可以帮助我...

我尝试了一切我想到的东西。一切都显示应该除了图像......！

这是数组：

cars: [
        {
          'carname': '2013 Toyota GT86', 
          'owner': 'Ryan',
          'desc': 'Aero Paket, BC Coilover, 3sdm 0.01 black matte, Invidia N1 Catback, Valenti taillights, camouflage vinyls, Vortech supercharger incl. oil cooler - 325hp daily driver',
          'image': 'toyota'
        }]

渲染部分：

render() {
    const cars = this.state.cars.map((car, i) => {
      return (
        <div key={i}>
          <div className="col-md-12 cBusiness">
            <h2>
              { car.carname }
            </h2>
              <p>Owner: { car.owner }</p>

              <p>{ car.desc }</p>

              <p>

                <img src={"pages/upload/{car.image}.jpg"} />

              </p>

          </div>
        </div>
      );
    });

结构：

Answer 1

做这样的事情：

 <img src={`pages/upload/${car.image}.jpg`} />

Answer 2

尝试使用模板文字：

<img src={`pages/upload/${car.image}.jpg`} />

或所有IE人员的旧skool：

<img src={"pages/upload/" + car.image + ".jpg"} />

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals