@heycar/heycars-map 2.0.0-switchMap1 → 2.0.0-switchMap3

package/dist/v2/components/MapProvider/MapProvider.d.ts

@@ -5,8 +5,8 @@ import { type GmapLoaderProps, type UseMapLoaderProps } from "../../hooks/useMap
 import { type MapSupplierPayolad } from "../../hooks/useMapSupplier";
 import type { AmapMap } from "../../types/interface";
 import { type AmapProps } from "../Amap";
-export type MapProviderProps = UseMapLoaderProps & Pick<MapSupplierPayolad, "gmapId" | "gmapRasterId">;
-export declare const MapProvider: import("vue").DefineComponent<import("vue3").ComponentObjectPropsOptions<MapProviderProps>, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").EmitByProps<MapProviderProps, Required<MapProviderProps>>, "change", MapProviderProps>;
+export type MapProviderProps = UseMapLoaderProps & Pick<MapSupplierPayolad, "gmapId" | "gmapRasterId" | "renderLoadFailedTitle" | "renderLoadFailedDescription">;
+export declare const MapProvider: import("vue").DefineComponent<import("vue3").ComponentObjectPropsOptions<MapProviderProps>, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").EmitByProps<MapProviderProps, Required<MapProviderProps>>, "success" | "fail", MapProviderProps>;
 export interface HeycarMapProps extends Pick<GmapLoaderProps, "fallback" | "loading">, Pick<AmapProps, "center" | "zoom"> {
     mapRef?: SetMap<AmapMap> | SetMap<google.maps.Map>;
     outerArea?: () => VueNode;

package/dist/v2/components/MapProvider/MapProvider.js

@@ -1,6 +1,6 @@
 import "../../css/MapProvider-156bfd53.css";
 import { h } from "vue";
-import { L as Loading, i as imgGrid } from "../../chunks/Loading.fc6e75d0.js";
+import { L as Loading, a as LoadFailed, i as imgGrid } from "../../chunks/Loading.da68a2a6.js";
 import { useMapLoader, Status } from "../../hooks/useMapLoader.js";
 import { provideMapSupplier, useMapSupplier } from "../../hooks/useMapSupplier.js";
 import { defineLagecySetup } from "../../types/helper.js";
@@ -36,7 +36,7 @@ const MapProvider = defineLagecySetup("MapProvider", function(props, {
     var _a;
     return h("div", [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
   };
-}).props(["amapKey", "amapSecret", "amapServiceHost", "gmapId", "gmapRasterId", "gmapKey", "supplier", "language"]);
+}).props(["amapKey", "amapSecret", "amapServiceHost", "gmapId", "gmapRasterId", "gmapKey", "supplier", "language", "renderLoadFailedTitle", "renderLoadFailedDescription"]);
 const HeycarMap = defineLagecySetup("HeycarMap", function(props, {
   slots,
   emit,
@@ -64,7 +64,7 @@ const HeycarMap = defineLagecySetup("HeycarMap", function(props, {
   const handleResize = () => emit("resize");
   loadTraditionalChineseConvertOnce(payload.language === "zh-TW");
   return () => {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     const {
       supplier,
       gmapId,
@@ -83,12 +83,19 @@ const HeycarMap = defineLagecySetup("HeycarMap", function(props, {
       const node = (_a = slots.loading) == null ? void 0 : _a.call(slots);
       return node ? h("div", [node]) : h(Loading);
     }
-    if (status === Status.FAILURE) {
+    if (status === Status.FAILURE || status === Status.TIMEOUT) {
       const node = (_b = slots.fallback) == null ? void 0 : _b.call(slots);
-      return node ? h("div", [node]) : h(Loading);
+      const title = (_c = payload.renderLoadFailedTitle) == null ? void 0 : _c.call(payload, status);
+      const description = (_d = payload.renderLoadFailedDescription) == null ? void 0 : _d.call(payload, status);
+      return node ? h("div", [node]) : h(LoadFailed, {
+        "attrs": {
+          "title": title,
+          "description": description
+        }
+      });
     }
-    const children = (_c = slots.default) == null ? void 0 : _c.call(slots);
-    const outArea = (_d = slots.outerArea) == null ? void 0 : _d.call(slots);
+    const children = (_e = slots.default) == null ? void 0 : _e.call(slots);
+    const outArea = (_f = slots.outerArea) == null ? void 0 : _f.call(slots);
     const mapId = patchGmapIdForAlipayCompatible({
       gmapId,
       gmapRasterId,
@@ -98,7 +105,7 @@ const HeycarMap = defineLagecySetup("HeycarMap", function(props, {
     switch (supplier) {
       case "gmap":
         return h("div", {
-          "class": `${heycarMap} ${(_e = attrs.class) != null ? _e : ""}`,
+          "class": `${heycarMap} ${(_g = attrs.class) != null ? _g : ""}`,
           "attrs": {
             "lang": language
           },
@@ -129,7 +136,7 @@ const HeycarMap = defineLagecySetup("HeycarMap", function(props, {
         }), outArea]);
       default:
         return h("div", {
-          "class": `${heycarMap} ${(_f = attrs.class) != null ? _f : ""}`,
+          "class": `${heycarMap} ${(_h = attrs.class) != null ? _h : ""}`,
           "attrs": {
             "lang": language
           },

package/dist/v2/css/Loading-0e058b68.css

@@ -0,0 +1,51 @@
+._17ify490 {
+  position: relative;
+  background-color: #EDF1F5;
+}
+._17ify491 {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+._17ify492 {
+  position: absolute;
+  margin: auto;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  width: fit-content;
+  height: fit-content;
+}
+._17ify493 {
+  width: 40.8vw;
+  height: 24.53vw;
+}
+._17ify494 {
+  position: absolute;
+  top: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: max-content;
+  left: 50%;
+  transform: translate(-50%, 0);
+}
+._17ify495 {
+  margin-top: 1.6vw;
+  font-family: var(--HEYCAR_MAP_CSS_VAR_FONT_REGULAR);
+  font-weight: 500;
+  font-size: 4vw;
+  color: #1E1E1E;
+  line-height: 6.4vw;
+}
+._17ify496 {
+  margin-top: 1.6vw;
+  font-family: var(--HEYCAR_MAP_CSS_VAR_FONT_REGULAR);
+  font-weight: 400;
+  font-size: 3.73vw;
+  color: #999BA1;
+  line-height: 6.4vw;
+  white-space: pre-line;
+  text-align: center;
+}

package/dist/v2/hooks/useDeviceOrientation.js

@@ -1,23 +1,7 @@
 import { reactive, watch } from "vue-demi";
 import { MINI_PROGRAM_WEB_VIEW_CLOSE_EVENT } from "../utils/patchMiniprogram.js";
 import { OS_PLATFORM, detectOSPlatform } from "../utils/platform.js";
-import { i as isObject, d as debounce } from "../chunks/debounce.5afe7867.js";
-var FUNC_ERROR_TEXT = "Expected a function";
-function throttle(func, wait, options) {
-  var leading = true, trailing = true;
-  if (typeof func != "function") {
-    throw new TypeError(FUNC_ERROR_TEXT);
-  }
-  if (isObject(options)) {
-    leading = "leading" in options ? !!options.leading : leading;
-    trailing = "trailing" in options ? !!options.trailing : trailing;
-  }
-  return debounce(func, wait, {
-    "leading": leading,
-    "maxWait": wait,
-    "trailing": trailing
-  });
-}
+import { t as throttle } from "../chunks/throttle.8bdd8d3b.js";
 const DEVICE_ORIENTATION_INTERVAL = 200;
 const CSS_DEVICE_ORIENTATION_VAR_PREFIX = "--CSS_DEVICE_ORIENTATION_VAR_ROTATION_DEGREE_";
 const useDeviceOrientation = (props) => {

package/dist/v2/hooks/useMapGCJ02.js

@@ -1,6 +1,6 @@
 import { AMAP_TO_GCJ02_TIMEOUT } from "../api/contants.js";
 import { lnglat2point } from "../utils/transform.js";
-import { useMapInChina } from "./useMapInChina.js";
+import { inChina, inHongkong, inMacau } from "./useMapInChina.js";
 import { useMapSupplier } from "./useMapSupplier.js";
 /**
  * @preserve
@@ -515,7 +515,6 @@ const exported = Object.assign(Object.assign({}, CRSTypes), {
 });
 const useAmapGCJ02 = () => {
   const { readyPromise } = useMapSupplier();
-  const { inChina } = useMapInChina();
   const toCoordinateType = (p) => {
     return inChina(p) ? "gcj02" : "wgs84";
   };
@@ -567,7 +566,6 @@ const useAmapGCJ02 = () => {
 };
 const useGmapGCJ02 = () => {
   const { readyPromise } = useMapSupplier();
-  const { inChina, inHongkong, inMacau } = useMapInChina();
   const toCoordinateType = (p) => {
     return inChina(p) && !inHongkong(p) && !inMacau(p) ? "gcj02" : "wgs84";
   };

package/dist/v2/hooks/useMapGraspRoad.js

@@ -3,7 +3,7 @@ import { apiGoogleSnapRoad } from "../api/googleSnapRoad.js";
 import { watchEffectForDeepOption } from "../utils/compare.js";
 import { lnglat2point, trackPoints2amapGraspRoadPoints } from "../utils/transform.js";
 import { useMapAngle } from "./useMapAngle.js";
-import { useMapInChina } from "./useMapInChina.js";
+import { inChina } from "./useMapInChina.js";
 import { useMapSupplier } from "./useMapSupplier.js";
 const GRASP_ROAD_INPUT_MIN_AMOUNT = 2;
 const GRASP_ROAD_INPUT_MAX_AMOUNT = 500;
@@ -12,7 +12,6 @@ const useAmapGraspRoad = (props) => {
   const pathRef = ref([]);
   const angleRef = ref(0);
   const { apiMapComputeHeading } = useMapAngle();
-  const { inChina } = useMapInChina();
   const apiMapToGraspRoadPath = (tracks) => {
     return new Promise((resolve) => {
       var _a, _b, _c;

package/dist/v2/hooks/useMapInChina.d.ts

@@ -1,16 +1,4 @@
 import { type Point } from "../types/interface";
-export declare const useMapInChina: () => {
-    inChina: (point: Point) => boolean;
-    inHongkong: (point: Point) => boolean;
-    inMacau: (point: Point) => boolean;
-};
-export declare const useAmapInChina: () => {
-    inChina: (point: Point) => boolean;
-    inHongkong: (point: Point) => boolean;
-    inMacau: (point: Point) => boolean;
-};
-export declare const useGmapInChina: () => {
-    inChina: (point: Point) => boolean;
-    inHongkong: (point: Point) => boolean;
-    inMacau: (point: Point) => boolean;
-};
+export declare const inChina: (point: Point) => boolean;
+export declare const inHongkong: (point: Point) => boolean;
+export declare const inMacau: (point: Point) => boolean;

package/dist/v2/hooks/useMapInChina.js

@@ -2593,22 +2593,17 @@ const macauBounds = [
     22.19885
   ]
 ];
-const useMapInChina = () => {
-  const inChina = (point) => {
-    return pointInPolygon(point, chinaBounds) >= 0;
-  };
-  const inHongkong = (point) => {
-    return pointInPolygon(point, hongkongBounds) >= 0;
-  };
-  const inMacau = (point) => {
-    return pointInPolygon(point, macauBounds) >= 0;
-  };
-  return { inChina, inHongkong, inMacau };
+const inChina = (point) => {
+  return pointInPolygon(point, chinaBounds) >= 0;
+};
+const inHongkong = (point) => {
+  return pointInPolygon(point, hongkongBounds) >= 0;
+};
+const inMacau = (point) => {
+  return pointInPolygon(point, macauBounds) >= 0;
 };
-const useAmapInChina = useMapInChina;
-const useGmapInChina = useMapInChina;
 export {
-  useAmapInChina,
-  useGmapInChina,
-  useMapInChina
+  inChina,
+  inHongkong,
+  inMacau
 };

package/dist/v2/hooks/useMapLoader.d.ts

@@ -7,6 +7,7 @@ export declare const DEFAULT_AMAP_PLUGINS: AmapLoaderProps["plugins"];
 export declare const DEFAULT_GMAP_LIBRARIES: LoaderOptions["libraries"];
 export declare enum Status {
     LOADING = "LOADING",
+    TIMEOUT = "TIMEOUT",
     FAILURE = "FAILURE",
     SUCCESS = "SUCCESS"
 }
@@ -19,7 +20,7 @@ declare global {
         };
     }
 }
-export interface AmapLoaderProps extends Pick<GmapLoaderProps, "fallback" | "loading" | "onChange">, Omit<AMapLoaderOptions, "key" | "version" | "plugins"> {
+export interface AmapLoaderProps extends Pick<GmapLoaderProps, "fallback" | "loading" | "onSuccess" | "onFail">, Omit<AMapLoaderOptions, "key" | "version" | "plugins"> {
     apiKey: string;
     apiSecret?: string;
     apiServiceHost?: string;
@@ -42,11 +43,13 @@ export interface GmapLoaderProps extends LoaderOptions {
      */
     fallback?: () => VNodeChild;
     /**
-     * Callback prop used to access `@googlemaps/js-api-loader` and `Status`.
-     *
-     * Note: The callback be executed multiple times in the lifecycle of the component.
+     * 成功回调只会触发一次
      */
-    onChange?: (status: Status) => void;
+    onSuccess?: () => void;
+    /**
+     * 失败回调可能会触发多次
+     */
+    onFail?: () => void;
 }
 export declare const useGmapLoader: (props: GmapLoaderProps) => {
     statusRef: import("vue-demi").ShallowRef<Status>;
@@ -64,7 +67,8 @@ export interface UseMapLoaderProps {
     amapServiceHost?: string;
     supplier: MapSupplier;
     language: Language;
-    onChange?: (status: Status) => any;
+    onSuccess?: () => void;
+    onFail?: () => void;
 }
 export declare const useMapLoader: (props: UseMapLoaderProps) => UseMapLoaderOutput;
 export {};

package/dist/v2/hooks/useMapLoader.js

@@ -1,6 +1,8 @@
-import { shallowRef, computed } from "vue-demi";
+import { shallowRef, computed, ref } from "vue-demi";
 import { watchPostEffectForDeepOption } from "../utils/compare.js";
 import { createRunOnce } from "../utils/helper.js";
+import { patchGoogleMapLoader } from "../utils/patchGoogleMapLoader.js";
+import { t as throttle } from "../chunks/throttle.8bdd8d3b.js";
 var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
 var distExports = {};
 var dist = {
@@ -537,6 +539,8 @@ class Loader {
     }
   }
 }
+const MIN_MAP_RELOAD_INTERVAL = 5e3;
+const GMAP_LOAD_TIMEOUT = 1e4;
 const DEFAULT_AMAP_PLUGINS = [
   "AMap.Geocoder",
   "AMap.Driving",
@@ -546,12 +550,13 @@ const DEFAULT_AMAP_PLUGINS = [
 const DEFAULT_GMAP_LIBRARIES = ["marker", "geometry"];
 var Status = /* @__PURE__ */ ((Status2) => {
   Status2["LOADING"] = "LOADING";
+  Status2["TIMEOUT"] = "TIMEOUT";
   Status2["FAILURE"] = "FAILURE";
   Status2["SUCCESS"] = "SUCCESS";
   return Status2;
 })(Status || {});
 const useAmapLoader = (props) => {
-  const { disableRef, onChange } = props;
+  const { disableRef, onSuccess, onFail } = props;
   let resolveLoader;
   let rejectLoader;
   const readyPromise = new Promise((resolve, reject) => {
@@ -563,49 +568,58 @@ const useAmapLoader = (props) => {
     /* LOADING */
   );
   const optionsRef = computed(() => {
-    const { onChange: onChange2, loading, fallback, apiKey, apiSecret, apiServiceHost, version, ...options } = props;
+    const {
+      onSuccess: onSuccess2,
+      onFail: onFail2,
+      loading,
+      fallback,
+      apiKey,
+      apiSecret,
+      apiServiceHost,
+      version,
+      ...options
+    } = props;
     return { ...options, key: apiKey, version: version != null ? version : "2.0" };
   });
+  const defineSecurityOnce = createRunOnce(() => {
+    window._AMapSecurityConfig = props.apiServiceHost ? {
+      serviceHost: props.apiServiceHost
+    } : { securityJsCode: props.apiSecret };
+  });
+  const reload = throttle(
+    (options) => {
+      if (statusRef.value === "SUCCESS")
+        return;
+      statusRef.value = "LOADING";
+      defineSecurityOnce();
+      return distExports.load(options).then(
+        () => {
+          statusRef.value = "SUCCESS";
+          resolveLoader();
+          onSuccess == null ? void 0 : onSuccess();
+        },
+        () => {
+          statusRef.value = "FAILURE";
+          rejectLoader();
+          onFail == null ? void 0 : onFail();
+        }
+      );
+    },
+    MIN_MAP_RELOAD_INTERVAL,
+    { trailing: false }
+  );
   watchPostEffectForDeepOption(
     () => [optionsRef.value, disableRef == null ? void 0 : disableRef.value],
     ([options, disable]) => {
       if (disable)
         return;
-      const setStatusAndExecuteCallback = (status) => {
-        statusRef.value = status;
-        if (status === "SUCCESS")
-          resolveLoader();
-        if (status === "FAILURE")
-          rejectLoader();
-        onChange == null ? void 0 : onChange(statusRef.value);
-      };
-      setStatusAndExecuteCallback(
-        "LOADING"
-        /* LOADING */
-      );
-      window._AMapSecurityConfig = props.apiServiceHost ? {
-        serviceHost: props.apiServiceHost
-      } : { securityJsCode: props.apiSecret };
-      distExports.load(options).then(
-        () => setStatusAndExecuteCallback(
-          "SUCCESS"
-          /* SUCCESS */
-        ),
-        () => setStatusAndExecuteCallback(
-          "FAILURE"
-          /* FAILURE */
-        )
-      );
+      reload(options);
     }
   );
   return { statusRef, readyPromise };
 };
-const loadGmapOnce = createRunOnce((opts) => {
-  const loader = new Loader(opts);
-  return loader.load();
-});
 const useGmapLoader = (props) => {
-  const { disableRef, onChange } = props;
+  const { disableRef, onSuccess, onFail } = props;
   let resolveLoader;
   let rejectLoader;
   const readyPromise = new Promise((resolve, reject) => {
@@ -617,50 +631,64 @@ const useGmapLoader = (props) => {
     /* LOADING */
   );
   const optionsRef = computed(() => {
-    const { onChange: onChange2, fallback, loading, language, ...options } = props;
+    const { onSuccess: onSuccess2, onFail: onFail2, fallback, loading, language, ...options } = props;
     return options;
   });
+  const timerRef = ref();
+  const reload = throttle(
+    (options) => {
+      if (statusRef.value === "SUCCESS")
+        return;
+      const loader = new Loader(options);
+      patchGoogleMapLoader(loader);
+      clearTimeout(timerRef.value);
+      timerRef.value = window.setTimeout(() => {
+        statusRef.value = "TIMEOUT";
+      }, GMAP_LOAD_TIMEOUT);
+      if (loader.status !== LoaderStatus.INITIALIZED) {
+        window.google = void 0;
+        loader.reset();
+      }
+      statusRef.value = "LOADING";
+      return loader.load().then(
+        () => {
+          clearTimeout(timerRef.value);
+          statusRef.value = "SUCCESS";
+          resolveLoader();
+          onSuccess == null ? void 0 : onSuccess();
+        },
+        () => {
+          clearTimeout(timerRef.value);
+          statusRef.value = "FAILURE";
+          rejectLoader();
+          onFail == null ? void 0 : onFail();
+        }
+      );
+    },
+    MIN_MAP_RELOAD_INTERVAL,
+    { trailing: false }
+  );
   watchPostEffectForDeepOption(
     () => [optionsRef.value, disableRef == null ? void 0 : disableRef.value],
     ([options, disable]) => {
       if (disable)
         return;
       const language = navigator.language;
-      const setStatusAndExecuteCallback = (status) => {
-        statusRef.value = status;
-        if (status === "SUCCESS")
-          resolveLoader();
-        if (status === "FAILURE")
-          rejectLoader();
-        onChange == null ? void 0 : onChange(statusRef.value);
-      };
-      setStatusAndExecuteCallback(
-        "LOADING"
-        /* LOADING */
-      );
-      loadGmapOnce({ ...options, language }).then(
-        () => setStatusAndExecuteCallback(
-          "SUCCESS"
-          /* SUCCESS */
-        ),
-        () => setStatusAndExecuteCallback(
-          "FAILURE"
-          /* FAILURE */
-        )
-      );
+      reload({ ...options, language });
     }
   );
   return { statusRef, readyPromise };
 };
 const useMapLoader = (props) => {
-  const { gmapKey, amapKey, amapSecret, amapServiceHost, language, onChange } = props;
+  const { gmapKey, amapKey, amapSecret, amapServiceHost, language, onSuccess, onFail } = props;
   const { statusRef: amapStatusRef, readyPromise: amapReadyPromise } = useAmapLoader({
     apiKey: amapKey,
     apiSecret: amapSecret,
     apiServiceHost: amapServiceHost,
     plugins: DEFAULT_AMAP_PLUGINS,
     disableRef: computed(() => props.supplier !== "amap"),
-    onChange
+    onSuccess,
+    onFail
   });
   const { statusRef: gmapStatusRef, readyPromise: gmapReadyPromise } = useGmapLoader({
     apiKey: gmapKey,
@@ -670,7 +698,8 @@ const useMapLoader = (props) => {
     // region: "CN",
     libraries: DEFAULT_GMAP_LIBRARIES,
     disableRef: computed(() => props.supplier !== "gmap"),
-    onChange
+    onSuccess,
+    onFail
   });
   return {
     get statusRef() {

package/dist/v2/hooks/useMapPlace.d.ts

@@ -3,6 +3,7 @@ import type { Place, Point } from "../types/interface";
 export interface UseMapPlaceProps {
     pointRef: Ref<Point>;
     emptyPlaceName: string;
+    signal?: AbortSignal;
     onChange?: (value: Place) => any;
 }
 export declare const useAmapPlace: (props: UseMapPlaceProps) => {

package/dist/v2/hooks/useMapPlace.js

@@ -1,23 +1,23 @@
 import { ref, reactive, watch } from "vue-demi";
 import { REGEO_TIMEOUT } from "../api/contants.js";
 import { createPipeTw } from "../utils/cn2tw.js";
-import { equalAssign } from "../utils/helper.js";
+import { equalAssign, createAbortable } from "../utils/helper.js";
 import { amapPlaceName2DisplayName, gmapPlaceName2DisplayName } from "../utils/transform.js";
-import { useAmapInChina } from "./useMapInChina.js";
+import { inChina } from "./useMapInChina.js";
 import { useMapSupplier } from "./useMapSupplier.js";
 import { useUpdate } from "./useUdate.js";
 const useAmapPlace = (props) => {
-  const { onChange, emptyPlaceName } = props;
+  const { signal, onChange, emptyPlaceName } = props;
   const defaultPoint = [...props.pointRef.value];
   const pointRef = ref(defaultPoint);
   const { readyPromise, language } = useMapSupplier();
-  const { inChina } = useAmapInChina();
   const place = reactive({
     lng: pointRef.value[0],
     lat: pointRef.value[1],
     name: "",
     displayName: ""
   });
+  const abortable = createAbortable(signal);
   const { idx: placeKey, update } = useUpdate();
   const updatePlace = (value) => {
     pointRef.value = value;
@@ -29,7 +29,7 @@ const useAmapPlace = (props) => {
     place.name = value.name;
     place.displayName = value.displayName;
   };
-  const getPlaceByRegeo = ([lng, lat]) => {
+  const getPlaceByRegeo = abortable(([lng, lat]) => {
     return new Promise((resolve) => {
       const geocoder = new AMap.Geocoder({ lang: language === "en" ? "en" : "zh_cn" });
       const pipeTw = createPipeTw(language === "zh-TW");
@@ -59,7 +59,7 @@ const useAmapPlace = (props) => {
         resolve({ lng, lat, name, displayName });
       }, REGEO_TIMEOUT);
     });
-  };
+  });
   watch(
     () => [placeKey.value],
     async () => {
@@ -72,7 +72,7 @@ const useAmapPlace = (props) => {
   return { place, updatePlace, setPlace, getPlaceByRegeo };
 };
 const useGmapPlace = (props) => {
-  const { onChange, emptyPlaceName } = props;
+  const { signal, onChange, emptyPlaceName } = props;
   const defaultPoint = [...props.pointRef.value];
   const pointRef = ref(defaultPoint);
   const { readyPromise, language } = useMapSupplier();
@@ -83,6 +83,7 @@ const useGmapPlace = (props) => {
     name: "",
     displayName: ""
   });
+  const abortable = createAbortable(signal);
   const updatePlace = (value) => {
     pointRef.value = value;
     update();
@@ -93,7 +94,7 @@ const useGmapPlace = (props) => {
     place.name = value.name;
     place.displayName = value.displayName;
   };
-  const getPlaceByRegeo = ([lng, lat]) => {
+  const getPlaceByRegeo = abortable(([lng, lat]) => {
     return new Promise((resolve) => {
       const geocoder = new google.maps.Geocoder();
       const pipeTw = createPipeTw(language === "zh-TW");
@@ -114,7 +115,7 @@ const useGmapPlace = (props) => {
         resolve({ lng, lat, name, displayName });
       }, REGEO_TIMEOUT);
     });
-  };
+  });
   watch(
     () => placeKey.value,
     async () => {

package/dist/v2/hooks/useMapRecomendPlace.d.ts

@@ -5,6 +5,7 @@ export interface UseMapRecomendPlaceProps<C = Record<string, any>> {
     context?: C;
     emptyPlaceName: string;
     queryingPlaceName: string;
+    signal?: AbortSignal;
     getLimit: (context?: C) => number;
     getAvailable?: (place: Place) => Promise<boolean>;
     getRecomendPlace: (place: Place, context?: C) => Promise<RecommendZonePlaces | undefined>;