微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

React-leaflet 层控制打开/关闭所有层

如何解决React-leaflet 层控制打开/关闭所有层

我有一个动态生成的图层列表,它是 react-leaflet 库组件,我想在列表顶部创建图层按钮,它将打开/关闭所有其他图层,我想使用 onclick 事件并通过以下方式控制它我自己,但没有这样的事件,所以有什么办法可以做到吗?

export const Points = ({
  points,setShowPointModal,setPointId,setIsEditPointMode,setComaprePointId,isPointsNonEditable,uniqueObjectTypes
}) => {
  const handleClick = (id) => {
    setPointId(id);
    setIsEditPointMode(true);
    setShowPointModal(true);
  };

  return (
    <>
      <LayersControl position="topleft">
        {uniqueObjectTypes.map(el=>{
          return(<LayersControl.Overlay key={el.Object_Type_Id} checked name={el.Object_Type_Name}>
            <LayerGroup>
              {points.filter(poi=> poi.Object_Type_Id===el.Object_Type_Id).map(
              ({
                Id: id,coordinates,Name_object,Description: description,Image: image,emissions,owner_type,Environments
              }) => (
                <>
                  <Point
                    id={id}
                    key={id}
                    coordinates={coordinates}
                    Name_object={Name_object}
                    description={description}
                    image={image}
                    emissions={emissions}
                    owner_type={owner_type}
                    handleClick={handleClick}
                    setComaprePointId={setComaprePointId}
                    isPointsNonEditable={isPointsNonEditable}
                    EnvironmentAttachment={Environments}
                  />
                </>
              ))}
            </LayerGroup>
          </LayersControl.Overlay>)
        })}
      </LayersControl>
    </>
  );
};

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。