覆盖物被其他组件包裹后不展示

uiwjs / react-baidu-map

基于 React 封装的百度地图组件，支持 React Hook，帮助你轻松的接入地图到 React 项目中。

https://uiwjs.github.io/react-baidu-map

MIT License

225 stars 22 forks source link

覆盖物被其他组件包裹后不展示 #41

Open zim-lee opened 4 years ago

zim-lee commented 4 years ago

业务场景：想用一组数据同时展示circler和marker，只能对数据做两次map，如果用Fragment或者自定义的其他dom包括后，这两个覆盖物都不会展示这样写不展示：

{
    data.map(({ type, color, lng, lat, radius }) => (
        <Fragment key={key}>
            <Circle
                visiable={true}
                strokeWeight={2}
                strokeColor={color}
                fillColor={color}
                fillOpacity={0.3}
                center={position}
                radius={radius}
            />
            <Marker 
                position={position} 
                visiable
            />
        </Fragment>
    ))
}

这样写才行（不够优雅）：

{
    data.map(({ type, color, lng, lat, radius }) => (
        <Circle
            key={type}
            visiable={true}
            strokeWeight={2}
            strokeColor={color}
            fillColor={color}
            fillOpacity={0.3}
            center={{ lng, lat }}
            radius={radius}
        />
    ))
}
{
    data.map(({ type, lng, lat }) => (
        <Marker
            key={type}
            position={{ lng, lat }} 
            visiable
        />
    ))
}

大佬有啥好的办法不