0
我已經通過'crate-react-app'命令安裝了反應模塊。現在我想在我的聯繫人頁面上顯示谷歌地圖。在頁面html中，谷歌地圖相關的js文件在文件末尾加載如下 -顯示谷歌地圖在反應js
============================ =========
<!-- External JavaScripts
============================================= -->
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/plugins.js"></script>
<!-- Footer Scripts
============================================= -->
<script type="text/javascript" src="js/functions.js"></script>
<script type="text/javascript" src="https://maps.google.com/maps/api/js?key=AIzaSyDMxJ92oBkSnVNHFX3R8XhtYQPEgk1_IiI"></script>
<script type="text/javascript" src="js/jquery.gmap.js"></script>
<script type="text/javascript">
$('#google-map').gMap({
address: 'Melbourne, Australia',
maptype: 'ROADMAP',
zoom: 14,
markers: [
{
address: "Melbourne, Australia",
html: '<div style="width: 300px;"><h4 style="margin-bottom: 8px;">Hi, we\'re <span>Envato</span></h4><p class="nobottommargin">Our mission is to help people to <strong>earn</strong> and to <strong>learn</strong> online. We operate <strong>marketplaces</strong> where hundreds of thousands of people buy and sell digital goods every day, and a network of educational blogs where millions learn <strong>creative skills</strong>.</p></div>',
icon: {
image: "images/icons/map-icon-red.png",
iconsize: [32, 39],
iconanchor: [32,39]
}
}
],
doubleclickzoom: false,
controls: {
panControl: true,
zoomControl: true,
mapTypeControl: true,
scaleControl: false,
streetViewControl: false,
overviewMapControl: false
}
});
</script>
</body>
</html>
所以，在我的公開/ index.html的，我這樣寫代碼 -
============== =====
<body class="stretched">
<div id="wrapper" class="clearfix"></div>
<div id="gotoTop" class="icon-angle-up"></div>
<script type="text/javascript" src="%PUBLIC_URL%/js/jquery.js"></script>
<script type="text/javascript" src="%PUBLIC_URL%/js/plugins.js"></script>
<script type="text/javascript" src="%PUBLIC_URL%/js/functions.js"></script>
</body>
</html>
而且在Contactus.js組成部分 - 我已經導入 - import $ from 'jquery';
和componentDidMount()功能添加$('#google-map').gMap({部分 但不知道怎麼以下文件加載contactus.js組件 -
<script type="text/javascript" src="https://maps.google.com/maps/api/js?key=AIzaSyDMxJ92oBkSnVNHFX3R8XhtYQPEgk1_IiI"></script> <script type="text/javascript" src="js/jquery.gmap.js"></script>
請幫我理清這一點。
嘗試指定的index.html的本身 –
請不要使用jQuery的反應該腳本，爲什麼這個人嗎？ :( 你可以使用手頭組件 –
@ShubhamKhatri，在'index.html'中指定不起作用。 – Atul