好客租房166-根据定位获取当前城市

import React from 'react'
// 导入样式
// import './index.scss'
import styles from './index.module.scss'
import NavHeader from '../../components/NavHeader'
export default class Map extends React.Component {
  componentDidMount() {
    this.initMap()
  }
  initMap() {
    //获取
    const { label, value } = JSON.parse(localStorage.getItem('hkzf_city'))
    console.log(label, value)
    //创建地址解析器
    const myGeo = new window.BMapGL.Geocoder()
    myGeo.getPoint(
      label,
      (point) => {
        if (point) {
          map.centerAndZoom(point, 11)
          // map.addOverlay(new window.BMapGL.Market(point))
          map.addControl(new window.BMapGL.NavigationControl())
          map.addControl(new window.BMapGL.ScaleControl())
        }
      },
      label
    )
    var map = new window.BMapGL.Map('container') // 创建地图实例
    var point = new window.BMapGL.Point(116.404, 39.915) // 创建点坐标
    map.centerAndZoom(point, 15) // 初始化地图，设置中心点坐标和地图级别
    /* 
            1 创建 Label 实例对象。
            2 调用 setStyle() 方法设置样式。
            3 在 map 对象上调用 addOverlay() 方法，将文本覆盖物添加到地图中。
          */
    const opts = {
      position: point,
      // offset: new BMap.Size(30, -30)
    }
    const labelList = new window.BMapGL.Label('文本覆盖物', opts)
    // 设置样式
    labelList.setStyle({
      color: 'green',
    })
    // 添加覆盖物到地图中
    map.addOverlay(labelList)
  }
  render() {
    return (
      <div className={styles.map}>
        {/* 顶部导航栏组件 */}
        <NavHeader onLeftClick={() => {}}>地图找房</NavHeader>
        <div id="container" className={styles.container}></div>
      </div>
    )
  }
}