Hỏi đáp

Chia sẻ kiến thức, cùng nhau phát triển

Đặt câu hỏi

Sử dụng Google Map Api trong Reactjs

7 năm trước 3.300 lượt xem 6 bình luận 7 năm trước

google-maps reactjs

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

x_html perl


<!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>
1
2
3
4
5
6
7
8
9
10
11
12
13
14

Trong console em đã gọi dk google.maps ra dk obj

nhưng trong component thì gọi google lại chỉ dk undefined

x_javascript php


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;
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

Bình luận

Để bình luận, bạn cần đăng nhập bằng tài khoản Howkteam.

Đăng nhập

Nguyễn Thành Long đã bình luận 7 năm trước

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 @@

Trả lời Báo cáo

Doko đã bình luận 7 năm trước

Thêm async với defer trong thẻ <script> nhé :D

https://stackoverflow.com/questions/36909380/why-use-defer-with-google-maps-javascript

Trả lời Báo cáo

Hỏi đáp

Chia sẻ kiến thức, cùng nhau phát triển

Sử dụng Google Map Api trong Reactjs

Bình luận

Câu hỏi mới nhất

AD BLOCKER DETECTED