Jetpack Compose中调用ViewModel方法致forEach循环重复执行排查

问题描述 #

在Jetpack Compose中获取数据并传递给ViewModel时，发现仅调用ViewModel的gettingTheProductContents方法时，forEach循环会重复执行；移除该调用后，循环仅执行一次，请求协助排查原因。

相关代码 #

页面代码 #

Column(Modifier.padding(16.dp)) {
    Text(text = "Upload ScreenView")

    GetMainContent { mainContents ->
        Log.i(TAG,"MainContents is getting twice is doubt $mainContents")
        mainContents.forEach { mainContent ->
            if(mainContent.contentType == "Products"){
                Log.i(TAG, "If Main Contents again is repeating $mainContent")
                viewModel.gettingTheProductContents(mainContent.contentTags)
            }
        }
    }
}

ViewModel方法 #

fun gettingTheProductContents(mainContentTags: List<String>?) {
    viewModelScope.launch {
        if (mainContentTags != null) {
            useCases.getProductsContent(mainContentTags).collect{
                getProductsContentResponse = it
            }
        }
    }
}

获取Firestore数据的Composable #

@Composable
fun GetMainContent(
    viewModel: MainContentUploadViewModel = hiltViewModel(),
    getMainContent: @Composable (mainContents : MainContents) -> Unit
){
    when(val mainContentResponse = viewModel.getMainContentDataResponse){
        is Response.Success -> getMainContent(mainContentResponse.data!!)
        else -> { }
    }
}

日志信息 #

I  MainContents is getting twice is doubt [MainContent(contentId=2C0dLLFto893vRLdQrmV, contentPosition=1,
I  MainContents is getting twice is doubt [MainContent(contentId=2C0dLLFto893vRLdQrmV, contentPosition=1,

---------------------------- PROCESS STARTED (29382) for package com.shivaconsulting.zipzipadmin ----------------------------
2023-08-01 14:06:23.303 29382-29382 AppTag                  com.shivaconsulting.zipzipadmin      I  MainContents is getting twice is doubt [MainContent(contentId=2C0dLLFto893vRLdQrmV,

排查分析 #

1. Compose重组触发：调用gettingTheProductContents后，ViewModel中的getProductsContentResponse状态会被更新（通过collect流赋值），触发Composable重组，导致GetMainContent再次执行，传入的getMainContent回调被二次调用，forEach循环重复执行。
2. 流持续监听问题：gettingTheProductContents中使用collect持续监听getProductsContent流，每次流发射新值都会更新状态，引发多次重组。
3. 无限制的回调执行：GetMainContent直接读取ViewModel状态，状态变化时会无条件触发回调，没有限制执行次数或触发条件。

解决方案 #

1. 用LaunchedEffect限制ViewModel方法调用时机 #

在页面代码的forEach循环中，将ViewModel方法调用包裹在LaunchedEffect中，确保仅在特定参数变化时执行一次：

mainContents.forEach { mainContent ->
    if(mainContent.contentType == "Products"){
        Log.i(TAG, "If Main Contents again is repeating $mainContent")
        LaunchedEffect(mainContent.contentTags) {
            viewModel.gettingTheProductContents(mainContent.contentTags)
        }
    }
}

2. 改用单次获取流数据 #

如果只需要获取一次产品数据，将collect替换为first()，避免持续监听引发多次状态更新：

fun gettingTheProductContents(mainContentTags: List<String>?) {
    viewModelScope.launch {
        mainContentTags?.let { tags ->
            val response = useCases.getProductsContent(tags).first()
            getProductsContentResponse = response
        }
    }
}

3. 优化状态更新逻辑 #

确保getMainContentDataResponse仅在数据真正变化时更新，避免重复发射相同数据引发不必要的重组。例如使用distinctUntilChanged()处理流数据。

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