【swiftUI】@PublishedでView外から取得したリストをView内でForEachする方法

外部から取得したリストはそのままでは使えない
解決策
NGなパターン

外部から取得したリストはそのままでは使えない

Viewの外でリストを用意して、それをViewでforEachしたいということは割とあると思いますが、簡単にはうまくいなかったので、解決策をまとめておきます。

解決策

最初にうまくいく方法を書いておきます。

import SwiftUI

struct ContentView: View {
 @ObservedObject var hoge = Hoge()

  var body: some View {
    hoge.setHogeList()
    ForEach(hoge.hogeList.indices, id: \.self) { index in
      Text(hoge.hogeList[index])
    }
  }
}

import Foundation

class Hoge : ObservableObject {
@Published var hogeList : [Int] = []

  func setHogeList() {
    for i in 0 ..< 5 {
      self.hogeList.append(i)
    }
  }
}

これでHoge classでhogeListセットした数字をViewのforEachで描画することができます。

ポイントは、forEachの書き方です。

ForEach(hoge.hogeList.indices, id: \.self)

NGなパターン

import SwiftUI

struct ContentView: View {
  var body: some View {
    ForEach(hoge.hogeList.indices) { index in
      Text(hoge.hogeList[index])
    }
  }
}

はい、id: \.self がありません。

forEachのイニシャライザには、以下の3つがありますが、Arrayの自身の要素のインデックス範囲を返す indices を使う場合には、2のinitを使うようにしましょう。

struct ForEach<Data, ID, Content> where Data : RandomAccessCollection, ID : Hashable {
// 1
  init(_ data: Data, @ViewBuilder content: @escaping (Data.Element) -> Content)

// 2
  init(_ data: Data, id: KeyPath<Data.Element, ID>, content: @escaping (Data.Element) -> Content)

// 3
  init(_ data: Range<Int>, @ViewBuilder content: @escaping (Int) -> Content)
}

参考：https://qiita.com/Kiuchi/items/39e3a4d5ee4be2186bcb

プログラミングを効率的に学ぶには、Udemyがオススメです。
Udemyは、世界最大の教育プラットフォームで、動画でスキルを学ぶことができます。