Hỏi đáp
Chia sẻ kiến thức, cùng nhau phát triển
Sử dụng Google Map Api trong Reactjs
21:03 21-07-2018
3.257 lượt xem
6 bình luận
08:58 22-07-2018
Anh nào từng xài google map api chỉ giúp em tại sao bị lỗi này vs ạ. Em đang muốn tạo một component có google map dk gắn vào.
Em đã lấy link của api trong thư mục html chính
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/redirect?Id=N6YwjGEN8hg4G7%2fPdB7GCDFZYd5YovTtZRzqb7Pb56atG%2b%2bsmEmglufMIydutwRs"
<link rel="stylesheet" href="/redirect?Id=gIFdg4v%2bjJHi9lPGABFgiV9Kmw8QGWeJnsUywrsd3%2f32Ajguu%2fLL%2fxJFiB8%2bie5CABWzHlwwyCkg23tzO3a1WTwDFLvM5OQ1JgLeX6ataXHWlNSAcClkZ9KPKBSDbWSxObnRBiuogvjgxzmmCCUn0a8SKyjnHFaR4qxTkJ3u0UU%3d"
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAq06l5RUVfib62IYRQacLc-KAy0XIWAVs"></script>
</head>
<body>
<div class="container"></div>
</body>
<script src="/bundle.js"></script>
</html>
Trong console em đã gọi dk google.maps ra dk obj
nhưng trong component thì gọi google lại chỉ dk undefined
import React, {Component} from 'react';
class GoogleMap extends Component{
componentDidMount(){
new google.maps.Map(this.refs.map,{ //google hien undefined
zoom:12,
center:{
lat:this.props.lat,
lng:this.props.lon,
}
})
}
render(){
return(
<div ref='map' />
);
}
}
export default GoogleMap;
Em nghe bảo là từ hôm 16/7 xài Google Maps phải mua API
cơ mà em xài API free của console.google cho dev cũng ko dk nữa @@
Thêm async với defer trong thẻ <script> nhé :D
https://stackoverflow.com/questions/36909380/why-use-defer-with-google-maps-javascript