ReactJS 从数组中渲染图像答案

【问题标题】：ReactJS rendering image from arrayReactJS 从数组中渲染图像
【发布时间】：2016-06-28 14:35:05
【问题描述】：

我正在尝试通过将数组名称放在 <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>
      );
    });

结构：

【问题讨论】：

标签： arrays image reactjs

【解决方案1】：

做这样的事情：

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

【讨论】：

【解决方案2】：

尝试使用模板文字：

对于所有 IE 人来说，还是老派：

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

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

【讨论】：