Question

我正在开发一个react.js项目，该项目需要有一个图像按钮或一个输入到路由器路由器的链接，但我似乎找不到办法来做到这一点。

这是我的代码：

render: function() {
return (
  <div className="Item" style={{backgroundImage: 'url(' +    this.props.poster + ')'}} >
    <div className="overlay">
      <div className="title">{this.props.title}</div>
      <div className="rating">{this.props.score} / 10</div>
      <div className="plot">{this.props.overview}</div>
      <div className="play"><input className="button" type="image" src="www.url.to/the/image"></input></div>
      <Link to={`/${this.props.id}`} id="link"/>
      <ListToggle />
    </div>
  </div>
 );
}

Answer 1

您需要将所有内容包裹在Link：

中

render: function() {
    return (
        <Link to={`/${this.props.id}`} id="link">
            <div className="Item" style={{backgroundImage: 'url(' +    this.props.poster + ')'}} >
                <div className="overlay">
                    <div className="title">{this.props.title}</div>
                    <div className="rating">{this.props.score} / 10</div>
                    <div className="plot">{this.props.overview}</div>
                    <div className="play"><input className="button" type="image" src="www.url.to/the/image"></input></div>
                    <ListToggle />
                </div>
            </div>
        </Link>
    );
}

如何将输入链接到反应路由器链接

1 个答案: