Zenn
😱

Scaffoldの中でsuspend関数を呼び出すときに躓いた

2021/12/27に公開
Android
Kotlin
coroutines
scaffold
suspend
tech

Scaffoldを使ったComposableの表示で躓く

以下のコードのように、Scaffoldのcontentでsuspend関数を呼び出すと、content内を1回だけ呼び出したいが2回呼び出されてしまうといった予期しない動きが出る（残念ながら、すべての場合ではなく特定の条件下でなるようだ…）。

問題のコード

Scaffold(
        scaffoldState = drawerState,
        topBar = {
            TopAppBar(
	    ...中略
	) {
	//コンテンツのところ
        when (uiState) {
            is MainViewModel.UiState.Initial -> {
	    userRepository.hogehoge() //こういうところとか
	    MainViewModel.iLoveCat()  //こういうところとか
	    ...中略

解決策

Androidの公式ページ「Compose における副作用」[1]の「LaunchedEffect: コンポーザブルのスコープ内で suspend 関数を実行する」に書いてあります。
LaunchedEffectを使うと解決するようです。実際、予期する動きになりました。
ちゃんと、動くCoroutineやスレッドを意識しないと、駄目ですね…

Scaffold(
        scaffoldState = drawerState,
        topBar = {
            TopAppBar(
	    ...中略
	) {
	//コンテンツのところ
        when (uiState) {
            is MainViewModel.UiState.Initial -> {
		    LaunchedEffect(drawerState.snackbarHostState) {
			    userRepository.hogehoge() //こういうところとか
			    MainViewModel.iLoveCat()  //こういうところとか
		    }
脚注

  1. Compose における副作用 / Android https://developer.android.com/jetpack/compose/side-effects ↩︎

Discussion