带有 Kotlin StateFlow 的 TextField答案

【问题标题】：TextField with Kotlin StateFlow带有 Kotlin StateFlow 的 TextField
【发布时间】：2020-09-03 17:41:59
【问题描述】：

我希望将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？

【问题讨论】：

标签： android kotlin android-jetpack-compose kotlin-flow

【解决方案1】：

此错误是由TextFieldValue 与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") }
    )
}

【讨论】：