如何在 React 中的图像映射中检测区域标记 onClick

Question

我想检测图像不同部分的onClick& onHover。

<img src={physicalimage} id="physicalimage" usemap="#image-map"/>
   <map name="image-map">
   <area target="" onClick={this.consoleMessage("bpleft")} alt="bpleft" title="bpleft"  coords="223,201,269,254" shape="rect" />
   <area target="" onClick={this.consoleMessage("bpright")} alt="bpright" title="bpright" coords="60,199,101,259" shape="rect" />
   <area target="" onClick={this.consoleMessage("heart")} alt="heartrate"  title="heartrate" coords="169,124,219,183" shape="rect" />
</map>

我使用反应库来开发我的网站。我无法检测到该onClick事件。还有其他选择吗？

Answer 1

我目前正在做完全相同的事情，并且偶然发现了这个包：React Image Mapper

到目前为止，它似乎可以满足我需要的一切。希望它将来对其他人有用。