导入现有项目地图以做出反应时未加载图像答案

【问题标题】：Image not loading while importing an existant project map to react导入现有项目地图以做出反应时未加载图像
【发布时间】：2021-04-11 10:51:34
【问题描述】：

我正在尝试将 https://github.com/ferolz/mapa-mexico-html5 导入到 react 项目，但图像未显示。

React 组件。

<map name="mexico" id="map_ID">
  <area id="AGU" data-id-estado="1" alt="AGU" title="Aguascalientes" className="area" href="www.cofemer.gob.mx" shape="poly" coords="317,269,317,268,319,268,319,269,320,269,320,270,321,270,321,272,322,272,322,275,323,275,323,276,324,276,324,277,325,277,325,278,324,278,324,279,322,279,322,280,321,280,321,281,320,281,320,282,319,282,319,283,315,283,315,282,312,282,312,281,308,281,308,282,306,282,306,283,306,282,305,282,305,280,304,280,304,277,305,277,305,275,307,275,307,274,308,274,308,273,310,273,310,272,311,272,311,271,313,271,313,270,315,269,317,269" />
</map>

HTML 加载图片

 <div id='content_mapa'>
      <img id="map_ID" className="map" src={require('./images/mapa.png')} useMap="#mexico" title="Mexico" alt="Mexico" />
       <div id="edo" >&nbsp;</div>
       <div className="escudo"></div>
 </div>

图像位于我的 src 项目中的文件夹中我创建了一个函数，以便我可以返回到我的

【问题讨论】：

标签： javascript reactjs

【解决方案1】：

尝试像这样导入图像：

import imageMap from './images/mapa.png'

然后在 img 上这样做：

<img id="map_ID" className="map" src={imageMap} useMap="#mexico" title="Mexico" alt="Mexico" />

【讨论】：

谢谢你在工作，但是里面的javascript没有，这样导入是否正确<script src="./js/jquery-1.10.2.min.js"></script> <script src="./js/jquery.maphighlight.min.js"></script> <script src="./js/imageMapResizer.min.js"></script> <script src="./js/scripts.js"></script>
我不确定，请在此处查看：w3schools.com/tags/att_script_src.asp