Javascript OpenLayers可以'；t使用组件类和Web包初始化映射

我正在努力重建这个。我想用Openlayers重建它，而不是使用传单（这是可行的，但出于不同的原因，我不想使用传单），但我不能用OL初始化地图

我在Chrome浏览器中收到此错误消息，表示我的地图对象为空：

Uncaught TypeError: Cannot set property 'innerHTML' of null
    at new Component (component.js:17)
    at new Map (map.js:28)
    at new Map (map.js:33)
    at ViewController.initializeComponents (main.js:26)
    at new ViewController (main.js:18)
    at eval (main.js:30)
    at Object.<anonymous> (bundle.js:1580)
    at __webpack_require__ (bundle.js:20)
    at bundle.js:64
    at bundle.js:67

---

您正在模糊地使用

Map

。试一试

import {Map as olMap} from 'ol'
...
export class Map extends Component {
    ...
    // Initialize Openlayers Map
    this.map = new olMap({

---

您正在模糊地使用

Map

。试一试

import {Map as olMap} from 'ol'
...
export class Map extends Component {
    ...
    // Initialize Openlayers Map
    this.map = new olMap({

---

酷，这解决了我的问题！：-）不幸的是，我没有注意到。酷，这解决了我的问题！：-）不幸的是，我没有注意到。

export class Map extends Component {
  constructor (placeholderId, props) {
    super(placeholderId, props, template)

   // Initialize Leaflet map
    this.map = L.map(this.refs.mapContainer, {
      center: [ 5, 20 ],
      zoom: 4,
      maxZoom: 8,
      minZoom: 4,
      maxBounds: [ [ 50, -30 ], [ -45, 100 ] ]
    })

    this.map.zoomControl.setPosition('bottomright') // Position zoom control
    this.layers = {} // Map layer dict (key/value = title/layer)
    this.selectedRegion = null // Store currently selected region

    // Render Carto GoT tile baselayer
    L.tileLayer(
      'https://cartocdn-gusc.global.ssl.fastly.net/ramirocartodb/api/v1/map/named/tpl_756aec63_3adb_48b6_9d14_331c6cbc47cf/all/{z}/{x}/{y}.png',
      { crs: L.CRS.EPSG4326 }).addTo(this.map)

  }
}

import {Map as olMap} from 'ol'
...
export class Map extends Component {
    ...
    // Initialize Openlayers Map
    this.map = new olMap({