如何将来自 compose 函数内部的值添加到数据存储中答案

【问题标题】：How to add a value coming from inside a compose function into a dataStore如何将来自 compose 函数内部的值添加到数据存储中
【发布时间】：2022-12-06 07:51:46
【问题描述】：

我正在构建一个使用 Compose 和 Navigation 的 Android 应用程序。在一个屏幕上，我有几个表单字段，每个表单字段都有自己的可组合函数，我想存储其中的值。我已经设法对主屏幕功能中的单个表单字段执行此操作，如 this example 所示：

@Composable
fun Screen1(navController: NavController) {
    val context = LocalContext.current 
    val scope = rememberCoroutineScope()
    val dataStoreName = StoreName(context)
    val savedName = dataStoreName.getValue.collectAsState(initial = "")
    Column( ) { 
        val patientName = remember { mutableStateOf("") }
        Button(onClick = {scope.launch {dataStoreName.saveValue(patientName.value)}
            navController.navigate(Screen.Screen2.route) })  {
                Text(text = "Save & Next")}
        OutlinedTextField( value = patientName.value,
            label = { Text(text = "Name") },
            onValueChange = {  patientName.value = it  }) 
        Text(text = "Current information stored: " + savedName.value)  }  }

但是，当我在自己的可组合函数中有多个字段时，我不清楚如何调整它。当我将 mutableState 变量放在文本字段函数中时，保存按钮中的代码无法识别它，而当我将它放在外面时，文本字段函数无法识别该变量... 这是我现在拥有的文本字段函数之一，我将在 Screen1 函数的列内调用它：

@Composable
fun PatientNameField() {
    val patientName by remember { mutableStateOf(TextFieldValue("")) }
    OutlinedTextField(
        value = patientName.value,
        label = { Text(text = "Name") },
        onValueChange = { patientName.value = it   }    )
}

【问题讨论】：

标签： android-jetpack-compose android-jetpack-navigation android-jetpack-datastore

【解决方案1】：

对于您当前的问题，您可以将 patientName 作为参数传递给您的 PatientNameField 可组合项，如下所示。这将有助于在您的 Screen1 和 PatientNameField 可组合项中维护 patientName 的状态。

@Composable
fun Screen1(navController: NavController) {
    val context = LocalContext.current
    val scope = rememberCoroutineScope()
    val dataStoreName = StoreName(context)
    val savedName = dataStoreName.getValue.collectAsState(initial = "")
    Column {
        val patientName = remember { mutableStateOf("") }
        Button(onClick = {
            scope.launch { dataStoreName.saveValue(patientName.value) }
            navController.navigate(Screen.Screen2.route)
        }) {
            Text(text = "Save & Next")
        }

        //pass the patientName as a parameter to your Composable
        PatientNameField(patientName)

        Text(text = "Current information stored: " + savedName.value)
    }
}

@Composable
fun PatientNameField(patientName: MutableState<String>) {
    OutlinedTextField(
        value = patientName.value,
        label = { Text(text = "Name") },
        onValueChange = { patientName.value = it   }    )
}

【讨论】：