Jetpack Compose中MutableStateOf未重新初始化致Switch状态异常

核心问题原因 #

1. isChecked与pd.retained反向：remember { mutableStateOf(pd.retained) }仅在组件首次组合时初始化状态，后续pd更新时不会自动同步，导致旧状态与新的pd.retained值出现偏差。
2. Switch状态共享：切换不同文档时，Compose复用了DocumentModalSheet的原有状态实例，因为remember没有绑定文档唯一标识，导致状态被不同文档共享。

方案一：组件内独立状态+自动同步 #

修改DocumentModalSheet，通过绑定文档ID作为remember的key确保每个文档拥有独立状态，再用LaunchedEffect监听pd变化，同步最新的retained值：

@Composable
fun DocumentModalSheet(
    pd: PrintDocument,
    onSwitchSelected: (id: Long, status: Boolean) -> Unit,
) {
    Log.i("DocumentModalSheet", "DocumentModalSheet: ${pd.retained}")
    
    // 用pd.id作为key，每个文档创建独立的状态实例
    var isChecked by remember(pd.id) {
        mutableStateOf(pd.retained)
    }

    // 监听pd变化，同步最新的retained值到isChecked
    LaunchedEffect(pd) {
        isChecked = pd.retained
    }

    Log.i("DocumentModalSheet", "DocumentModalSheet: $isChecked") 

    Column(modifier = Modifier.fillMaxWidth()) {
        Switch(
            checked = isChecked,
            onCheckedChange = { newStatus ->
                isChecked = newStatus
                onSwitchSelected(pd.id, newStatus)
            }
        )
    }
}

方案二：状态提升至ViewModel（推荐） #

将文档状态统一托管到ViewModel，遵循单一数据源原则，彻底解决状态同步与共享问题：

1. ViewModel修改

class PrintDocumentViewModel : ViewModel() {
    private val _pdListFlow = MutableStateFlow<Resource<PrintDocumentData>>(Resource.Loading)
    val pdListFlow = _pdListFlow.asStateFlow()

    // 更新文档的retained状态，并同步到列表流
    fun updateDocumentRetained(id: Long, status: Boolean) {
        val currentState = _pdListFlow.value
        if (currentState is Resource.Success) {
            val updatedDocuments = currentState.data.printDocuments.map { doc ->
                if (doc.id == id) doc.copy(retained = status) else doc
            }
            _pdListFlow.value = Resource.Success(
                currentState.data.copy(printDocuments = updatedDocuments)
            )
        }
    }
}

2. DocumentModalSheet修改

直接从ViewModel获取当前文档的retained状态，无需内部维护状态：

@Composable
fun DocumentModalSheet(
    pd: PrintDocument,
    viewModel: PrintDocumentViewModel,
    onSwitchSelected: (id: Long, status: Boolean) -> Unit,
) {
    // 通过derivedStateOf自动跟随ViewModel中数据变化
    val isChecked by remember(pd.id) {
        derivedStateOf { pd.retained }
    }

    Column(modifier = Modifier.fillMaxWidth()) {
        Switch(
            checked = isChecked,
            onCheckedChange = { newStatus ->
                viewModel.updateDocumentRetained(pd.id, newStatus)
                onSwitchSelected(pd.id, newStatus)
            }
        )
    }
}

3. 调用处修改

传递ViewModel到DocumentModalSheet：

ModalBottomSheetLayout(
    sheetContent = {
        DocumentModalSheet(clickedPD, viewModel) { id, status ->
            // 可选：处理额外业务逻辑
        }
    },
    // ... 其余代码
)

方案三：状态提升至父组件（PrintDocumentScreen） #

如果不想改动ViewModel，也可以在父组件维护每个文档的状态映射：

@Composable
fun PrintDocumentScreen(viewModel: PrintDocumentViewModel) {
    val pdListFlow = viewModel.pdListFlow.collectAsState()
    var clickedPD by remember { mutableStateOf(PrintDocument()) }
    val modalSheetState = rememberModalBottomSheetState(..)
    // 维护每个文档的选中状态映射
    val documentCheckedStates = remember { mutableMapOf<Long, Boolean>() }

    ModalBottomSheetLayout(
        sheetContent = {
            DocumentModalSheet(clickedPD, documentCheckedStates) { id, status ->
                documentCheckedStates[id] = status
                viewModel.doSomething(id, status)
            }
        },
        content = {
            // ... 其余代码
        }
    )
}

// 修改后的DocumentModalSheet
@Composable
fun DocumentModalSheet(
    pd: PrintDocument,
    documentCheckedStates: MutableMap<Long, Boolean>,
    onSwitchSelected: (id: Long, status: Boolean) -> Unit,
) {
    val isChecked by remember(pd.id) {
        mutableStateOf(documentCheckedStates.getOrDefault(pd.id, pd.retained))
    }

    Column(modifier = Modifier.fillMaxWidth()) {
        Switch(
            checked = isChecked,
            onCheckedChange = { newStatus ->
                onSwitchSelected(pd.id, newStatus)
            }
        )
    }
}

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