如何让Jetpack Compose中的rememberMarkerState正常工作？

我在Google Map里做标记的添加和删除，一开始用普通的MarkerState完全正常，代码是这样的：

GoogleMap(
    modifier = Modifier.fillMaxSize(),
    cameraPositionState = cameraPositionState,
    onMapLongClick = { latLng ->
        viewModel.addPlace(latLng.latitude, latLng.longitude)
    }
) {
    places.forEach { place ->
        val markerState = MarkerState(
            position = LatLng(place.lat, place.lng)
        )

        Marker(
            state = markerState,
            title = "Party",
            snippet = "Come to party.",
            onInfoWindowLongClick = {
                viewModel.deletePlace(place.id)
            },
            draggable = true
        )
    }
}

后来因为要跟踪标记的状态，我把markerState改成了rememberMarkerState：

val markerState = rememberMarkerState(
    position = LatLng(place.lat, place.lng)
)

结果就出问题了：

• 新增标记时，数据库里已经加上了，但界面上看不到新标记
• 删除标记时，点哪个删不掉，反而把别的标记给删了

有没有人碰到过同样的情况？

解决方案 #

这问题核心是Compose的状态记忆机制和循环里的元素标识缺失导致的：

1. rememberMarkerState会缓存状态，当places列表更新（增删元素），forEach循环没给每个Marker指定唯一标识，Compose分不清哪个标记对应哪个数据，就会乱复用状态。
2. 没唯一标识的话，新增元素时Compose可能不会给新元素创建新的rememberMarkerState；删除元素时，会把剩余元素的状态错位复用，就出现删错标记的情况。

解决方法很简单，给循环里的每个Marker加上唯一key就行，用place.id当标识，让Compose能准确跟踪每个标记的状态：

修改后的代码：

GoogleMap(
    modifier = Modifier.fillMaxSize(),
    cameraPositionState = cameraPositionState,
    onMapLongClick = { latLng ->
        viewModel.addPlace(latLng.latitude, latLng.longitude)
    }
) {
    places.forEach { place ->
        // 用place.id作为唯一key，确保每个Marker的状态独立不混乱
        key(place.id) {
            val markerState = rememberMarkerState(
                position = LatLng(place.lat, place.lng)
            )

            Marker(
                state = markerState,
                title = "Party",
                snippet = "Come to party.",
                onInfoWindowLongClick = {
                    viewModel.deletePlace(place.id)
                },
                draggable = true
            )
        }
    }
}

内容的提问来源于stack exchange，提问作者Always Learner