無限スクロールを作ろうと思って、要素の最後にonAppearをつけたら画面読み込んだ時点で発火しよったよ。困ったよね。でも解決したので備忘録！！！

ScrollViewに要素を追加すると、レンダリング時点でonAppearは発火する

つまり、こういう状態だったわけだけど、画面開いた瞬間、つまり画面に該当箇所が映っていないにもかかわらず、発火するのが仕様らしい。

ScrollView{

     ForEach(somedata){data in
          someview(data)
          .onAppear{
               if data.id == somedata.last?.id{
                    print("最後よ")
               }
          }
     }
}

これ、もう画面読み込んだ時点で最後よってログに出る。これは困ったね。

起動した時点で延々と次データの読み込みが走って危険な状態に

LazyVStackが救ってくれる

Lazyがつくやつで囲むとちゃんと該当箇所が画面に出た時点で発火するようになる。
こんな感じ

ScrollView{
     LazyVStack{
          ForEach(somedata){data in
               someview(data)
               .onAppear{
                    if data.id == somedata.last?.id{
                         print("最後よ::::\(item.textArea)")
                    }
               }
          }
     }
}

これでscrollviewでもonAppearが使えるようになった、よかったね

コメント