@uiw/react-amap-info-window/cjs/useInfoWindow.js

用于在地图上弹出一个详细信息展示窗体，地图上只允许同时展示 `1` 个信息窗体。

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useInfoWindow = void 0;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = require("react");
var _reactAmapUtils = require("@uiw/react-amap-utils");
var _reactAmapMap = require("@uiw/react-amap-map");
var _excluded = ["visiable", "visible", "position"];
var useInfoWindow = exports.useInfoWindow = function useInfoWindow() {
  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  var visiable = props.visiable,
    visible = props.visible,
    position = props.position,
    other = (0, _objectWithoutProperties2["default"])(props, _excluded);
  var _useMapContext = (0, _reactAmapMap.useMapContext)(),
    map = _useMapContext.map;
  var _useState = (0, _react.useState)(visiable),
    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
    isOpen = _useState2[0],
    setIsOpen = _useState2[1];
  var _useState3 = (0, _react.useState)(),
    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
    infoWindow = _useState4[0],
    setInfoWindow = _useState4[1];
  var _usePortal = (0, _reactAmapUtils.usePortal)(),
    container = _usePortal.container,
    Portal = _usePortal.Portal;
  (0, _react.useLayoutEffect)(function () {
    if (!AMap || !map) return;
    if (!infoWindow) {
      var positionCenter = map.getCenter();
      if (props.children) {
        other.content = container;
      }
      var instance = new AMap.InfoWindow((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, other), {}, {
        position: position || positionCenter
      }));
      setInfoWindow(instance);
      if (isOpen) {
        instance.open(map, position || positionCenter);
      }
      return function () {
        if (instance) {
          map && map.remove(instance);
          setInfoWindow(undefined);
        }
      };
    }
  }, [map]);
  (0, _react.useEffect)(function () {
    if (infoWindow) {
      infoWindow.setContent(props.children ? container : other.content || '');
    }
  }, [props.children, container, other.content, infoWindow]);
  var visibleView = visible !== null && visible !== void 0 ? visible : visiable;
  (0, _react.useMemo)(function () {
    if (isOpen !== visibleView && infoWindow && map) {
      setIsOpen(visibleView);
      if (visibleView) {
        var positionCenter = map.getCenter();
        infoWindow.open(map, position || positionCenter);
      } else {
        infoWindow.close();
      }
    }
  }, [visibleView, infoWindow]);
  (0, _react.useEffect)(function () {
    if (!map || !infoWindow || !visibleView) return;
    var positionCenter = map.getCenter();
    infoWindow.open(map, position || positionCenter);
  }, [position]);
  (0, _reactAmapUtils.useSettingProperties)(infoWindow, props, ['Content', 'Anchor', 'Size']);
  (0, _reactAmapUtils.useEventProperties)(infoWindow, props, ['onOpen', 'onClose', 'onChange']);
  return {
    isOpen: isOpen,
    setIsOpen: setIsOpen,
    infoWindow: infoWindow,
    setInfoWindow: setInfoWindow,
    InfoWindowPortal: Portal
  };
};