使用数据类保存 TextField 的 value 和 onValueChange 参数时，不会出现 TextField 击键

Question

我尝试通过在列表中迭代它们来创建同一 TextField 的多个实例，而不是直接创建每个实例。问题是文本字段中没有出现任何击键。

首先，我将 value 和 onValueChange 参数放入名为“TextFieldClass”的数据类中。

data class TextFieldClass(
    var textValue: String,
    var onTextChange: (String) -> Unit,
    val label : String
)

然后我创建了一个列表，其中包含两个名为“textFieldClasses”的“TextFieldClass”实例

val textFieldClasses = listOf(
    TextFieldClass(
        textValue = "",
        onTextChange = { newValue ->},
        label = "Text Field 1"
    ),
    TextFieldClass(
        textValue = "",
        onTextChange = { newValue ->},
        label = "Text Field 2"
    )

）

然后，我创建了一个可组合项，其中包含名为“TextFieldListItem”的 TextField UI，值、onValueChange 和标签参数将传递到构造函数中。

Composable
fun TextFieldListItem(
    text: String,
    onTextChange: (String) -> Unit,
    label: String
) {
    TextField(
        value = text,
        onValueChange = { onTextChange(it) },
        label = { Text(label) }
    )

}

然后，我创建了另一个可组合项来包含“TextFieldListItem”，并迭代名为“TextFieldList”的“textFieldClasses”列表，如果使用列表过多会造成混乱，我很抱歉。

@Composable
fun TextFieldList() {
    Column {
        textFieldClasses.forEach{ textFieldTests ->
            TextFieldListItem(
                text = textFieldTests.textValue,
                onTextChange = {textFieldTests.onTextChange(it)},
                label = textFieldTests.label
                )
        }
    }
}

最后我把它全部放在主要活动中。

但是问题仍然存在。击键未出现在文本字段上。它只是保持空状态。

有谁知道如何解决这个问题吗？

Answer 1

这里的核心问题是你基本上在这里声明了一个空函数：

TextFieldClass( 
    textValue = "",
    onTextChange = { newValue ->},  // empty function doing nothing
    label = "Text Field 1"
)

然后将该空函数分配给

onTextChange

的

TextField

。

这里的第二个问题是您正在使用

var

作为

TextFieldClass

数据类中的属性。 Jetpack Compose 无法观察可变

var

iable 的变化。您应该将其更改为

val

并使用

copy

函数更新数据类的属性。