Jetpack Compose返回父页面后ViewModel数据未更新问题修复

问题根源 #

1. FilterViewModel仅在初始化时读取一次底层数据源，后续筛选页面更新数据后，ViewModel未同步刷新状态
2. 父页面未正确监听StateFlow的变化，导致状态更新后UI无法自动重组
3. 需确保Filter和ConfigFilter指向同一数据源实例，保证数据修改能双向同步

修复步骤 #

1. 改造FilterViewModel，支持状态刷新

修改FilterViewModel，移除lazy初始化并添加主动刷新方法，确保数据源更新后能同步到StateFlow：

@HiltViewModel
class FilterViewModel @Inject constructor(
    private val filter: Filter
) : ViewModel() {
    private val _filterState = MutableStateFlow(
        FilterState(
            filter.loadGroup(),
            filter.showCompleted(),
            filter.showCustomerReturns(),
            filter.vendorName(),
        )
    )
    val filterState = _filterState.asStateFlow()

    // 从数据源重新拉取最新值并更新状态
    fun refreshFilterState() {
        _filterState.value = FilterState(
            filter.loadGroup(),
            filter.showCompleted(),
            filter.showCustomerReturns(),
            filter.vendorName(),
        )
    }
}

2. 修正父页面的状态监听与刷新逻辑

在ParentScreen中正确监听StateFlow变化，并在从筛选页面返回时自动触发状态刷新：

@Composable
fun ParentScreen(
    navController: NavController,
    modifier: Modifier = Modifier,
    vm: FilterViewModel = hiltViewModel(),
) {
    // 将StateFlow转换为Compose可观察的State，确保状态变化时UI重组
    val filterState by vm.filterState.collectAsState()

    // 监听导航栈变化，回到父页面时自动刷新筛选状态
    val currentBackStackEntry by navController.currentBackStackEntryAsState()
    LaunchedEffect(currentBackStackEntry) {
        // 替换为你实际的父页面路由名称
        if (currentBackStackEntry?.destination?.route == NavGraph.PARENT_SCREEN) {
            vm.refreshFilterState()
        }
    }

    Filters(
        showCompleted = filterState.showCompleted,
        showCustomerReturns = filterState.showCustomerReturns,
        vendorName = filterState.vendorName,
        loadGroup = filterState.loadGroup,
        onClick = { navController.navigate(NavGraph.FILTER_SCREEN) }
    )
}

3. 确保数据源共享

通过Hilt的@Singleton注解，让Filter和ConfigFilter指向同一实例，保证数据修改同步：

// 定义统一的数据源接口
interface FilterDataSource {
    fun loadGroup(): String
    fun showCompleted(): Boolean
    fun showCustomerReturns(): Boolean
    fun vendorName(): String
    fun toggleShowCustomerReturns()
    fun toggleShowCompleted()
    fun saveLoadGroup(text: String)
    fun saveVendorName(text: String)
}

// 实现单例数据源
@Singleton
class FilterDataSourceImpl @Inject constructor(
    // 可依赖SharedPreferences、Room等持久化存储
) : FilterDataSource {
    // 实现所有接口方法
}

// 让两个ViewModel依赖同一数据源
@HiltViewModel
class FilterViewModel @Inject constructor(
    private val dataSource: FilterDataSource
) : ViewModel() {
    // ... 之前的逻辑，将filter替换为dataSource
}

@HiltViewModel
class ConfigFilterViewModel @Inject constructor(
    private val dataSource: FilterDataSource
): ViewModel() {
    // ... 之前的逻辑，将configFilter替换为dataSource
}

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