如何在使用Compose UI时为每个列表项创建单独的视图模型？

How to create separate ViewModels per list item when using Compose UI?(如何在使用Compose UI时为每个列表项创建单独的视图模型？)

问题描述

我正在开发一款交易应用程序。我需要列出用户股票及其价值(收益或亏损)和投资组合的总价值。

对于持股列表，在MVP架构中，我会为每个列表项创建一个演示者，但对于这个应用程序，我决定使用MVVM(Compose、ViewModels和Hilt)。我的第一个想法是为每个列表项创建不同的视图模型。我在Composable方法签名中使用hiltViewModel()来创建我的ViewModel的实例，但是这总是给我相同的实例，这不是我想要的。在使用MVVM架构时，我想要做的是正确的方式，还是应该使用单一的视图模型？你知道有什么我可以看一下的项目吗？下图是我的实际屏幕的超级简化，每个单元格都很复杂，这就是为什么我想为每个单元格使用不同的ViewModel。欢迎提出任何建议。

推荐答案

Hiltdoesn't support键控视图模型。Compose中有一个feature request键控视图模型，但我们必须等到Hilt支持它。

这里有一个关于如何暂时绕过它的老套解决方案。

您可以创建一个可以与键一起使用的普通视图模型，并通过Hilt视图模型向该视图模型传递注入：

class SomeInjection @Inject constructor() {
    val someValue = 0
}

@HiltViewModel
class InjectionsProvider @Inject constructor(
    val someInjection: SomeInjection
): ViewModel() {

}

class SomeViewModel(private val injectionsProvider: InjectionsProvider) : ViewModel() {
    val injectedValue get() = injectionsProvider.someInjection.someValue
    var storedValue by mutableStateOf("")
        private set

    fun updateStoredValue(value: String) {
        storedValue = value
    }
}

@Composable
fun keyedViewModel(key: String) : SomeViewModel {
    val injectionsProvider = hiltViewModel<InjectionsProvider>()
    return viewModel(
        key = key,
        factory = object: ViewModelProvider.Factory {
            override fun <T : ViewModel?> create(modelClass: Class<T>): T {
                @Suppress("UNCHECKED_CAST")
                return SomeViewModel(injectionsProvider) as T
            }

        }
    )
}

@Composable
fun TestScreen(
) {
    LazyColumn {
        items(100) { i ->
            val viewModel = keyedViewModel("$i")
            Text(viewModel.injectedValue.toString())
            TextField(value = viewModel.storedValue, onValueChange = viewModel::updateStoredValue)
        }
    }
}

这篇关于如何在使用Compose UI时为每个列表项创建单独的视图模型？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！