优化地图标记点处理逻辑,增加对标记点数组的有效性检查,确保渲染时数据的正确性,提升代码可维护性和用户体验。

This commit is contained in:
zyh
2025-04-11 06:05:26 +00:00
parent e86b0af2c4
commit 6e49f62aff
2 changed files with 12 additions and 8 deletions

View File

@@ -308,7 +308,7 @@ export const useAMapMarkers = ({
};
useEffect(() => {
if (!map) return;
if (!map || !Array.isArray(markers)) return;
// 清理旧的标记点和聚合点
if (clusterInstance.current) {
@@ -319,10 +319,12 @@ export const useAMapMarkers = ({
markersRef.current = [];
// 根据配置添加新的标记点
if (showCluster) {
handleCluster();
} else {
handleMarkers();
if (markers.length > 0) {
if (showCluster) {
handleCluster();
} else {
handleMarkers();
}
}
return () => {

View File

@@ -107,9 +107,11 @@ export const LoginMapPage = () => {
};
// 渲染地图标记点
const renderMarkers = (locations: LoginLocation[]): MarkerData[] => {
const renderMarkers = (locations: LoginLocation[] = []): MarkerData[] => {
if (!Array.isArray(locations)) return [];
return locations
.filter(location => location.longitude !== null && location.latitude !== null)
.filter(location => location?.longitude !== null && location?.latitude !== null)
.map(location => ({
id: location.id?.toString() || '',
longitude: location.longitude as number,
@@ -157,7 +159,7 @@ export const LoginMapPage = () => {
<Spin spinning={markersLoading}>
<div style={{ height: '100%', minHeight: '500px' }}>
<AMap
markers={renderMarkers(locations)}
markers={renderMarkers(locations || [])}
center={locations[0] && locations[0].longitude !== null && locations[0].latitude !== null
? [locations[0].longitude, locations[0].latitude] as [number, number]
: undefined}