如果你正在使用JSX和Harmony，你可以这样做:

<img className="image" src={`images/${this.props.image}`} />

在这里，您将src的值写成表达式。

对于寻找w.r.t到“映射”函数和动态数据的答案的People，这里有一个工作示例。

<img src={"http://examole.com/randomview/images" + each_actor['logo']} />

这将给出URL为“http://examole.com/randomview/images/2/dp_pics/182328.jpg”(随机示例)

你可以使用

<img className="image" src=`images/${this.props.image}`>

or

<img className="image" src={'images/'+this.props.image}>

or

  render() {
         let imageUrl = this.props.image ? "images/"+this.props.image : 'some placeholder url image';
    return (
       <div>
          <img className="image" src={imageUrl} />
       </div>
    )
  }

这里是动态类名或道具的最佳选项，只需像我们在Javascript中做的那样做一些连接。

     className={
        "badge " +
        (this.props.value ? "badge-primary " : "badge-danger ") +
        " m-4"
      }

如果你想使用es6模板文字，你也需要在标记周围使用大括号:

<img className="image" src={`images/${this.props.image}`} />

如果你正在使用JSX和Harmony，你可以这样做:

<img className="image" src={`images/${this.props.image}`} />

在这里，您将src的值写成表达式。