Android Jetpack Compose - MVVM 在 TextField 上重构

Question

试图让TextField 使用 MVVM 模式重构似乎不起作用？

当我执行Log.d 时，我得到了输入，但发生了零重组。到处搜索，似乎找不到“简单”的解决方案。

似乎所有示例都在可组合内完成所有操作，而不是使用 MVVM？

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            TextFieldRecomposeTheme {
                Surface(color = MaterialTheme.colors.background) {
                    GetInput(myVM = MyViewModel())
                }
            }
        }
    }
}

@Composable
fun GetInput(myVM: MyViewModel) {

    Column(
        modifier = Modifier.fillMaxSize(),
        horizontalAlignment = Alignment.CenterHorizontally,
        verticalArrangement = Arrangement.Center
    ) {

        OutlinedTextField(
            value = myVM.updatedClientData.firstName,
            onValueChange = { myVM.updatedClientData.firstName = it },
            label = { Text(text = "Firstname")}
        )
    }

}

class MyViewModel() : ViewModel() {

    var updatedClientData by mutableStateOf<Client>(Client())

    // This is just for testing - the data will be loaded from a remote server and set
    init {
        updatedClientData = Client(
            id = 1,
            firstName = "Test",
            lastName = "User",
            email = "test.user@domain.com",
            mobilePhone = "777666555"
        )
    }
}

data class Client(
    @SerializedName("Id")
    val id: Int = 0,
    @SerializedName("FirstName")
    var firstName: String = "",
    @SerializedName("LastName")
    val lastName: String = "",
    @SerializedName("Email")
    val email: String = "",
    @SerializedName("MobilePhone")
    val mobilePhone: String = "",
)

Answer 1

原因是您正在更新类中的字段。不是可变可观察属性的字段。只有整个updatedClientData 的变化才会触发重组。您可以使用myVM.updatedClientData = myVM.updatedClientData.copy(firstName = it) 解决此问题