尝试在@Composable 中获取 ViewModel

Question

我正在尝试学习 Jetpack Compose。我坚持使用 ViewModels。

我有一个 ViewModel

class DataViewModel: ViewModel() {

    //the list of live data
    var listData = mutableListOf<Data>()

    //initialize the viewmodel
    init {

        viewModelScope.launch {
            //do the network call (this is working ok)
            val data = fetchData()
            data.forEach {
                listData.add(it)
                //print the list of data, this is working fine
                println("listData")
            }

        }
    }

所以获取数据并将其放入 dataList 工作正常。但不，我想在我的屏幕上显示数据。我做了一个组合

@Composable
//pass in the viewmodel
fun DataScreen(model:DataViewModel = viewModel()){
    println("model.listData")
    this return an empty list ?
    Column{
        model.listData?.forEach { item ->

            Text("${item}")

            }
        }

   }

在我的屏幕上没有任何反应，因为它是可组合项中的一个空列表。我如何从 ViewModel 获取列表？

Answer 1

问题是您没有在视图模型中使用 State 值。需要状态才能为可组合重组注册您的值（如果值为 assigned/changed）

所以你需要像这样的视图模型（我猜你的 fetchData 是一个挂起函数）：

   class DataViewModel: ViewModel() {

    //the list of live data
    val listDataState = MutableState<List<Data>> =  mutableStateOf(emptyList<Data>())

    //initialize the viewmodel
    init {

        viewModelScope.launch {
            val data = fetchData()
            listDataState.value = data

        }
    }

    suspend fun fetchData() : List<Data>{
        //something like: 
        return dataRepository.getData()
    }

   }

然后在你的@Composable函数中你得到这样的数据：

val viewModel: DataViewModel = viewModel()
val data = viewModel.listDataState.value

尝试在@Composable 中获取 ViewModel

Trying to get ViewModel in @Composable

android

kotlin

android-jetpack

android-jetpack-compose