优化地图标记点处理逻辑,增加对标记点数组的有效性检查,确保渲染时数据的正确性,提升代码可维护性和用户体验。
This commit is contained in:
@@ -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 () => {
|
||||
|
||||
@@ -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}
|
||||
|
||||
Reference in New Issue
Block a user