可组合调用只能在 @Composable 函数的上下文中发生

Question

我有一个可组合函数，我需要在单击按钮后调用它，但它一直显示无法通过单击按钮执行可组合项的错误，谁能指导我解决这个问题谢谢

这是我的代码

  Box(contentAlignment = Alignment.Center) {
               Button(onClick = {
                    // This is a composable function that i need to call
                    SignUpNewUser(email,fullName,country,password)
                }
                ,modifier = Modifier
                       .width(200.dp)
                       .background(color = Color.DarkGray)) {
                Text(text = "Sign Up",style = TextStyle(color = Color.White,fontWeight = FontWeight.Bold))
            }
        }

Answer 1

您只能将一个 @Composable 视图添加到另一个 @Composable 视图。

onClick 未标记为 @Composable，因此您会收到此警告。您只能使用 onClick.

更改状态

例如，您可以创建一个标志并根据该标志显示 UI：

var signUp by remember { mutableStateOf(false) }
if (signUp) {
    SignUpNewUser(email, fullName, country, password)
} else {
    Box(contentAlignment = Alignment.Center) {
        Button(onClick = {
            signUp = true
        }, modifier = Modifier
            .width(200.dp)
            .background(color = Color.DarkGray)) {
            Text(text = "Sign Up", style = TextStyle(color = Color.White, fontWeight = FontWeight.Bold))
        }
    }
}

我建议你从 this youtube video which explains the basic principles of when you need to use state in compose. You can continue deepening your knowledge with state in Compose documentation 开始。

另一种选择是使用 Compose Navigation。

可组合调用只能在 @Composable 函数的上下文中发生

Composable invocations can only happen from the context of a @Composable function

android

kotlin

android-jetpack-compose