fix: Fix map.remove report errors. #11

uiwjs · Sep 29, 2020 · cc4d59d · cc4d59d
1 parent dae3d4f
commit cc4d59d
Show file tree

Hide file tree

Showing 10 changed files with 47 additions and 30 deletions.
diff --git a/src/BezierCurve/useBezierCurve.tsx b/src/BezierCurve/useBezierCurve.tsx
@@ -13,7 +13,7 @@ export const useBezierCurve = (props = {} as UseBezierCurve) => {
       setBezierCurve(instance);
       return () => {
         if (instance) {
-          map && map.remove(instance);
+          map && map.removeLayer(instance);
           setBezierCurve(undefined);
         }
       }

diff --git a/src/CircleMarker/useCircleMarker.tsx b/src/CircleMarker/useCircleMarker.tsx
@@ -14,7 +14,7 @@ export const useCircleMarker = (props = {} as UseCircleMarker) => {
       setCircleMarker(instance);
       return () => {
         if (instance) {
-          map && map.remove(instance);
+          map && map.removeLayer(instance);
           setCircleMarker(undefined);
         }
       }

diff --git a/src/Ellipse/useEllipse.tsx b/src/Ellipse/useEllipse.tsx
@@ -14,7 +14,7 @@ export const useEllipse = (props = {} as UseEllipse) => {
       setEllipse(instance);
       return () => {
         if (instance) {
-          map && map.remove(instance);
+          map && map.removeLayer(instance);
           setEllipse(undefined);
         }
       }

diff --git a/src/HawkEyeControl/useHawkEyeControl.tsx b/src/HawkEyeControl/useHawkEyeControl.tsx
@@ -17,8 +17,9 @@ export function useHawkEyeControl(props = {} as UseHawkEyeControl) {
       });
 
       return () => {
-        if (instance && map && map.remove) {
-          map.remove(instance);
+        if (instance && map) {
+          map.removeLayer(instance);
+          setHawkEyeControl(undefined);
         }
       }
     }

diff --git a/src/Map/useMap.tsx b/src/Map/useMap.tsx
@@ -23,7 +23,8 @@ export const useMap = (props: UseMap = {}) => {
     }
     return () => {
       if (instance) {
-        instance.destroy();
+        setMap(undefined);
+        // instance.destroy();
       }
     }
   }, [container]);

diff --git a/src/Polygon/README.md b/src/Polygon/README.md
@@ -36,16 +36,19 @@ const Example = () => {
       </button>
       <div style={{ width: '100%', height: '500px' }}>
         <Map zoom={14} center={[116.400274, 39.905812]}>
-          <Polygon
-            visiable={show}
-            path={path}
-            strokeColor="#FF33FF"
-            strokeWeight={6}
-            strokeOpacity={0.2}
-            fillOpacity={0.4}
-            fillColor="#1791fc"
-            zIndex={50}
-          />
+          {show && (
+
+            <Polygon
+              // visiable={show}
+              path={path}
+              strokeColor="#FF33FF"
+              strokeWeight={6}
+              strokeOpacity={0.2}
+              fillOpacity={0.4}
+              fillColor="#1791fc"
+              zIndex={50}
+            />
+          )}
         </Map>
       </div>
     </>

diff --git a/src/Polygon/usePolygon.tsx b/src/Polygon/usePolygon.tsx
@@ -14,7 +14,7 @@ export const usePolygon = (props = {} as UsePolygon) => {
       setPolygon(instance);
       return () => {
         if (instance) {
-          map && map.remove(instance);
+          map && map.removeLayer(instance);
           setPolygon(undefined);
         }
       }

diff --git a/src/Polyline/usePolyline.tsx b/src/Polyline/usePolyline.tsx
@@ -14,7 +14,7 @@ export function usePolyline(props = {} as UsePolyline) {
       setPolyline(instance);
       return () => {
         if (instance) {
-          map && map.remove(instance);
+          map && map.removeLayer(instance);
           setPolyline(undefined);
         }
       }

diff --git a/src/Rectangle/useRectangle.tsx b/src/Rectangle/useRectangle.tsx
@@ -14,7 +14,7 @@ export const useRectangle = (props = {} as UseRectangle) => {
       setRectangle(instance);
       return () => {
         if (instance) {
-          map && map.remove(instance);
+          map && map.removeLayer(instance);
           setRectangle(undefined);
         }
       }

diff --git a/src/types/core.d.ts b/src/types/core.d.ts
@@ -94,16 +94,6 @@ declare namespace AMap {
      * @param duration 如果使用动画过度，动画过度的时长控制，单位 ms，默认值是内部自动计算的一个动态值。
      */
     panBy(x: number, y: number, duration?: number): void;
-    /**
-     * 从地图上移除图层
-     * @param layer 地图图层
-     */
-    removeLayer(layer: TileLayer | Satellite | Traffic | RoadNet): void;
-    /**
-     * 将多个图层一次替代地图上原有图层，会移除地图原有图层
-     * @param layers 地图图层数组
-     */
-    setLayers(layers:Array<TileLayer | Satellite | Traffic | RoadNet>): void;
     /**
      * 获取地图图层数组，数组为一个或多个图层
      * @returns 地图图层数组
@@ -130,6 +120,28 @@ declare namespace AMap {
      * @param cursor 设置鼠标指针默认样式，参数cursor应符合CSS的cursor属性规范。可为CSS标注中的光标样式， 如：setCursor(“pointer”)等；或者自定义的光标样式， 如：setCursor("url(' https://lbs.amap.com/webapi/static/Images//0.png' ),pointer")
      */
     setDefaultCursor(cursor): void;
+    /**
+     * 从地图上移除图层
+     * @param layer 地图图层
+     */
+    removeLayer(layer:
+      TileLayer |
+      Polygon |
+      Polyline |
+      BezierCurve |
+      Satellite |
+      Rectangle |
+      Traffic |
+      Ellipse |
+      HawkEye |
+      CircleMarker |
+      RoadNet
+    ): void;
+    /**
+     * 将多个图层一次替代地图上原有图层，会移除地图原有图层
+     * @param layers 地图图层数组
+     */
+    setLayers(layers:Array<TileLayer | Satellite | Traffic | RoadNet>): void;
     /**
      * 添加覆盖物/图层。参数为单个覆盖物/图层，或覆盖物/图层的数组。
      * @param features 覆盖物对象或者数组 VectorOverlay | Array<any>
@@ -139,7 +151,7 @@ declare namespace AMap {
      * 删除覆盖物/图层。参数为单个覆盖物/图层，或覆盖物/图层的数组。
      * @param features Array<any> | VectorOverlay
      */
-    remove(features: Array<any> | TileLayer | Polyline | HawkEye | Marker | Rectangle | Polygon | InfoWindow | Ellipse | BezierCurve | CircleMarker | Circle): void;
+    remove(features: Array<any> | TileLayer | HawkEye | Marker | InfoWindow | Circle): void;
     /**
      * 注销地图对象，并清空地图容器
      */