Jetpack Compose：内部状态变化时如何触发重组？

问题描述 #

我是Jetpack Compose新手，遇到一个概念性问题，想了解这类场景的常规处理方式，可能我的实现思路不符合Compose的设计理念。

我实现了一个单例NotificationService，不同组件可通过它添加通知，服务里包含一个用于渲染当前通知的@Composable函数renderNotifications，简化代码如下：

object NotificationService {
    private val notifications = mutableListOf<NotificationContainer>()

    @Composable
    fun renderNotifications() {
        // 清理过期通知
        notifications.removeAll { it.showUntil.isBefore(OffsetDateTime.now()) }

        var index = 0
        notifications.forEach {
            Notification(it.message, index)
            index++
        }
    }

    fun notificationCount(): Int {
        return notifications.size
    }

    fun addNotification(message: String) {
        notifications.add(NotificationContainer(message, OffsetDateTime.now().plusSeconds(5)))
    }
}

data class NotificationContainer(val message: String, val showUntil: OffsetDateTime)

在应用主入口调用该渲染函数：

fun main() = application {
    // 依赖
    val notificationService = NotificationService

    notificationService.renderNotifications()

    OtherComposable() { ... }
}

OtherComposable持有NotificationService引用，点击按钮添加通知时，renderNotifications仅初始调用一次。我知道原因是渲染函数没有输入变化，Compose没有重组触发条件，只有NotificationService内部状态改变。想知道：

1. 这类仅自身知晓何时需重组的组件该如何处理？
2. 尝试过暴露通知数量让父组件感知变化，但不知道如何绑定传递给父组件，这种需要告知父组件「请重新绘制我，我的相关状态已改变」的场景通常该如何处理？

解决方案 #

1. 用Compose可观察状态替换普通集合 #

Compose的重组核心依赖可观察状态，你当前使用的mutableListOf是普通集合，无法触发重组。需要将notifications替换为Compose提供的状态容器，常用两种方式：

方式一：使用mutableStateListOf

mutableStateListOf是Compose内置的可观察集合，当集合内容增删改时，会自动触发依赖该集合的重组范围更新：

object NotificationService {
    // 替换普通mutableListOf为mutableStateListOf
    private val notifications = mutableStateListOf<NotificationContainer>()

    @Composable
    fun renderNotifications() {
        // 用LaunchedEffect定期清理过期通知，避免在重组流程中修改状态
        LaunchedEffect(Unit) {
            while (true) {
                delay(1000)
                val now = OffsetDateTime.now()
                notifications.removeAll { it.showUntil.isBefore(now) }
            }
        }

        notifications.forEachIndexed { index, container ->
            Notification(container.message, index)
        }
    }

    fun notificationCount(): Int {
        return notifications.size
    }

    fun addNotification(message: String) {
        notifications.add(NotificationContainer(message, OffsetDateTime.now().plusSeconds(5)))
    }
}

修改后，调用addNotification时集合的变化会自动触发renderNotifications重组，无需父组件额外操作。

方式二：使用StateFlow（适合跨环境状态共享）

如果你的通知服务需要在非Compose环境（如ViewModel、普通业务类）中被观察，StateFlow是更合适的选择：

import kotlinx.coroutines.flow.MutableStateFlow
import kotlinx.coroutines.flow.StateFlow
import kotlinx.coroutines.flow.update
import androidx.compose.runtime.collectAsState

object NotificationService {
    private val _notifications = MutableStateFlow<List<NotificationContainer>>(emptyList())
    // 对外暴露只读的StateFlow，避免外部直接修改状态
    val notifications: StateFlow<List<NotificationContainer>> = _notifications

    @Composable
    fun renderNotifications() {
        // 收集StateFlow状态，自动感知变化触发重组
        val currentNotifications = notifications.collectAsState()
        val now = OffsetDateTime.now()
        // 过滤过期通知，生成新列表而非修改原集合
        val activeNotifications = currentNotifications.value.filterNot { it.showUntil.isBefore(now) }

        activeNotifications.forEachIndexed { index, container ->
            Notification(container.message, index)
        }

        // 定期清理过期通知（可选，也可以在addNotification时处理）
        LaunchedEffect(Unit) {
            while (true) {
                delay(1000)
                _notifications.update { list ->
                    list.filterNot { it.showUntil.isBefore(OffsetDateTime.now()) }
                }
            }
        }
    }

    fun notificationCount(): Int {
        return _notifications.value.size
    }

    fun addNotification(message: String) {
        _notifications.update { current ->
            current + NotificationContainer(message, OffsetDateTime.now().plusSeconds(5))
        }
    }
}

通过collectAsState()订阅StateFlow，状态更新时会自动触发renderNotifications重组。

2. 避免在@Composable函数中直接修改状态 #

你之前在renderNotifications里调用notifications.removeAll，属于在重组流程中修改状态，可能引发意外的重组循环。正确做法是：

• 用LaunchedEffect执行定期清理操作
• 或在addNotification时先过滤掉过期通知，再添加新通知

3. 父组件感知状态的思路（可选） #

如果确实需要父组件感知通知数量变化，可以将数量封装为派生状态：

import androidx.compose.runtime.derivedStateOf
import androidx.compose.runtime.State

object NotificationService {
    private val notifications = mutableStateListOf<NotificationContainer>()
    // 派生状态，自动跟随notifications数量变化
    val notificationCount: State<Int> = derivedStateOf { notifications.size }

    // ... 其他代码不变
}

父组件中使用该状态：

fun main() = application {
    val notificationService = NotificationService
    // 收集count状态，变化时触发父组件重组
    val count = notificationService.notificationCount

    notificationService.renderNotifications()

    OtherComposable() { ... }
}

不过这种方式其实没必要，因为renderNotifications本身已经可以通过内部可观察状态自行触发重组。

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