使用 Kotlin StateFlow 的 TextField

Question

我想将 TextField 绑定到来自视图模型的 MutableStateFlow。我是这样设置的：

@Composable
fun MyTextField(textFlow: MutableStateFlow<String>) {
    val state = textFlow.collectAsState(initial = "")
    TextField(
        value = TextFieldValue(state.value),
        onValueChange = { textFlow.value = it.text },
        label = { Text(text = "Label") }
    )
}

当我在文本字段中键入内容时，它的行为真的很奇怪。例如，如果我输入 'asd'，它以 'asdasa' 结尾。如何更新 textFlow.value 而不会弄乱文本字段？

Answer 1

这个错误是由于 TextFieldValue with Flow.

的使用引起的

要解决此问题，请将 TextField 的 value 设置为 state.value，然后在文本更改时将值设置为 textFlow.value = it。

@Composable
fun MyTextField(textFlow: MutableStateFlow<String>) {
    val state = textFlow.collectAsState(initial = "")
    TextField(
        value = state.value,
        onValueChange = { textFlow.value = it },
        label = { Text(text = "Label") }
    )
}