search

terence55 / react-baidu-maps

React Components for Baidu Maps
24 stars 4 forks source link

使用Marker，addOverlay undefiend #6

Closed danranshizhi closed 6 years ago

danranshizhi commented 6 years ago

直接将overlays和untils的文件夹，放在项目目录中，使用时，报错Cannot read property 'addOverlay' of undefined

Marker.js里面我改了一个地方 constructor(props) { super(props); const propTypes = {

  [MARKER_CLUSTERER]: PropTypes.object
};

} 放在constructor的外面会报错，打包会报错，改成上面这个样子，打包不报错了，但是运行时，addOverlay undefined,请问楼主这个要怎么样处理？

terence55 commented 6 years ago

建议通过npm install使用，这样使用的是打包发布过的代码，最好不要通过Copy源文件的方式。

回答你的问题：

static propTypes = {
    [MAP]: PropTypes.object,
    [MARKER_CLUSTERER]: PropTypes.object
  };

这里需要babel-plugin-transform-class-properties支持才能转换static属性

如果不想装，把定义移到class下

Marker.propTypes = {
    [MAP]: PropTypes.object,
    [MARKER_CLUSTERER]: PropTypes.object
  };
danranshizhi commented 6 years ago

直接不可以使用你的Marker.js这个文件夹吗？我在Marker.js里面按照楼主上面说的，将static那个移到class Marker...的下面，还是addOverlay undefined

danranshizhi commented 6 years ago

楼主的源码我直接download下来，用的Marker.js这个文件

terence55 commented 6 years ago

如果直接使用源码，请确保没有漏文件，以及依赖的babel plugin都装上。不太确定你的错误原因，最好能在codesandbox或者codepen上放一下能重现的代码。

danranshizhi commented 6 years ago

在项目中直接通过npm install react-baidu-maps --save得方式安装使用，因为需要用到Marker,所以直接download下来你的源码，然后将overlay和util文件夹直接放在项目中，就出现了addOverlay undefined 换句话说，如果安装你这个插件，要用到polyline ,cricle这些，要怎么样使用？

terence55 commented 6 years ago

不太理解为什么你已经npm安装了，还要引入源码，所有的组件都已经export了。 Overlay的使用请参考README和Overlay的Sample，BaiduMaps自带的Overlay都抽象成了React组件，能设置的属性已在组件的PropTypes上描述，基本上和BaiduMap自身的一一对应。

import { BaiduMap, Marker } from 'react-baidu-maps';

<BaiduMap
  mapUrl={`http://api.map.baidu.com/api?v=2.0&ak=${MAP_KEY}`}
  mapContainer={<div style={{ height: '100%' }} />} >
  <Marker position={{ lng: 116.404, lat: 39.915 }} />
</BaiduMap>