如何通过ViewModel跨Composable修改Int值并在跳转后生效

首先修正你提供的ViewModel代码里的变量名错误（_hanging应该是_amt），同时调整为更规范的MVVM写法——外部只暴露只读状态，通过函数修改值：

import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.State
import androidx.lifecycle.ViewModel

class SharedViewModel : ViewModel() {
    // 内部可变状态，仅ViewModel内可修改
    private var _amt = mutableStateOf<Int>(5)
    // 外部只读状态，Composable可观察
    val amt: State<Int> = _amt

    fun changeHangingToFortyFive() {
        _amt.value = 45
    }
}

实现步骤 #

• 共享ViewModel实例
  在所有需要访问这个值的Composable中，通过viewModel()函数获取同一个ViewModel实例（默认情况下，同一导航图内的Composable会共享同一个实例，确保数据同步）。

• 触发值修改的Composable
  比如在首页添加按钮，点击时调用ViewModel的修改函数，再导航到目标页面：

  import androidx.compose.foundation.layout.Column
  import androidx.compose.material3.Button
  import androidx.compose.material3.Text
  import androidx.compose.runtime.Composable
  import androidx.lifecycle.viewmodel.compose.viewModel
  import androidx.navigation.NavHostController
  
  @Composable
  fun HomeScreen(navController: NavHostController, viewModel: SharedViewModel = viewModel()) {
      Column {
          Text(text = "当前值: ${viewModel.amt.value}")
          Button(onClick = {
              // 修改值
              viewModel.changeHangingToFortyFive()
              // 导航至目标页面
              navController.navigate("detail")
          }) {
              Text(text = "改值并跳转")
          }
      }
  }
  

• 展示更新后值的Composable
  目标页面直接读取ViewModel的amt状态，由于它是State类型，Composable会自动感知值的变化并重组刷新：

  import androidx.compose.foundation.layout.Column
  import androidx.compose.material3.Text
  import androidx.compose.runtime.Composable
  import androidx.lifecycle.viewmodel.compose.viewModel
  
  @Composable
  fun DetailScreen(viewModel: SharedViewModel = viewModel()) {
      Column {
          Text(text = "跳转后的值: ${viewModel.amt.value}")
      }
  }
  

• 导航配置
  用Navigation Compose搭建导航结构，确保两个页面属于同一导航图，这样ViewModel实例会被共享：

  import androidx.compose.runtime.Composable
  import androidx.navigation.compose.NavHost
  import androidx.navigation.compose.composable
  import androidx.navigation.compose.rememberNavController
  
  @Composable
  fun AppNavigation() {
      val navController = rememberNavController()
      NavHost(navController = navController, startDestination = "home") {
          composable("home") {
              HomeScreen(navController = navController)
          }
          composable("detail") {
              DetailScreen()
          }
      }
  }
  

核心原理 #

ViewModel的生命周期不受Composable的重组或导航影响，只要是同一实例，修改后的值会一直保留。用mutableStateOf包裹整数，能让Composable自动监听值的变化，导航到目标页面时自然能看到最新值。

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