React Hooks: useState updater function: 为什么这个钩子在拖动时会删除对象?

Question

我在地图上有一个标记，它在拖动时采用此功能：

function handleOnDragEndUpdateMarker(e) {
var markerIndex = e.target.options.marker_index;
var markerLatLng = e.target.getLatLng(); //get marker LatLng
markerLatLng.id = markerIndex;
updateUserMarker(markerLatLng, markerIndex);
}

该函数触发另一个函数updateUserMarker，该函数通过上下文来自组件：

它使用索引，一个新对象，其中包含来自event的更新lat和long，并附加一个也将来自事件的id。

在上下文组件中，我有这个函数：

updateUserMarker: (marker, markerIndex) => {
console.log('marker, markerIndex ', marker, markerIndex);
let updatedMarker = user.markers.map(element =>
element.id == markerIndex ? { ...element, ...marker } : element
)[0];
console.log(
'user.markers[markerIndex] updatedMarker ',
user.markers[markerIndex],
updatedMarker
);
setUser({
...user,
markers: [
{
...user.markers[markerIndex],
...(user.markers[markerIndex] = updatedMarker)
}
]
});
},

它适用于第一个对象 - lat 和 lang，但在拖动开始后添加第二个对象时，它会消失！

可能几个小时前就应该尝试来这里，但想尽我最大的努力！

提前谢谢你！

Answer 1

我不确定你为什么用[0]来updatedMarker.我假设您要更新其 id 与 markerIndex 匹配的标记。

updateUserMarker: (marker, markerIndex) => {
let updatedMarkers = user.markers.map(element =>
element.id == markerIndex ? { ...element, ...marker } : element
);

setUser({
...user,
markers: [...updatedMarkers]
});
}