如何調用子組件 lambda

Question

@Composable
fun Root() {
    Scaffold(
            floatingActionButton = {
                FloatingActionButton(onClick = {}) {
                    Icon(Icons.Filled.Favorite)
                }
            }
    ) {
        Child()
    }
}

@Composable
fun Child() {
    var textField1 by remember { mutableStateOf("") }
    TextField(value = textField1, onValueChange = {textField1 = it})

    val validateAndMakeNetworkRequest = {

    }
}

如何在沒有 state 提升的情況下從浮動操作按鈕調用validateAndMakeNetworkRequest ？ 上面的代碼只是示例， Child可組合性可能非常深

Answer 1

事實上，你沒有。 在 Jetpack Compose 中，我們並沒有真正調用函數，有一個 gradle 插件發揮了一些魔法來簡化我們的代碼，但是，實際發生的是我們正在對運行時說“嘿，這是我想要調用的函數”和運行時會根據它認為合適的次數調用它來組成屏幕。

很容易注意到，如果你在一個可組合函數中輸出一個Log.d("some", "thing") ，即使我們什么都不做，應用程序也可能會多次記錄它。

我知道您對“沒有狀態提升”感到難過，但這不是聲明式的工作方式。 您需要一個存儲在狀態中的布爾值和一個使用它是否調用可組合的“if”。

在網絡請求的情況下，你可以在一個普通的函數中將它分開，並在你的內部調用它FloatingActionButton onClick 。

Answer 2

你必須傳遞一個回調函數，而 function 將以 function 作為參數

@Composable
fun Child(onNext: (onClick: () -> Unit) -> Unit) {
// now you can call this function from parent
onNext() {
    Log.d("data", "clicked")
}
}

@Composable
fun Parent() {
var onClickForChild by remember {
    mutableStateOf({})
}
Child(onNext = { onClickForChild = it })
Button(onClick = { onClickForChild() }) {
    Text(text = "Next")
}
}