Sure, Why not?

List 데이터 식별하는 방법 본문

💻

List 데이터 식별하는 방법

joho2022 2024. 8. 31. 11:50

오! 하나 또 배웠당

 

SwiftUI Tutorials를 학습하면서

지금까지 직접 코드를 치면서 Stack을 생성하거나 속성을 설정했었는데,

SwiftUI Inspector에서, 즉 속성창으로 마우스 딸깍 한번으로 만들어내는 과정을 배우면서,

생산성을 빠르게 높일 수 있겠다라는 생각을 가지게 되었습니다.

 

 

List를 동적으로 나타낼 때,

식별 가능한 데이터와 함께 실행이 됩니다.

저는 매개변수에서 데이터와 함께 id: \.id 설정하는 방법만 알고 있었습니다.

 

 

그런데, 기존 방법과 포함해서 데이터를 식별 가능하게 만드는 방법은 총 두 가지인 것을 배우게 되었습니다.

  1. 각 요소를 고유하게 식별하는 속성에 대한 키 경로를 설정한다.
  2. 데이터 자체에 Identifiable 프로토콜을 채택해준다.

1. 키 경로를 이용해 데이터 식별

Identifiable을 직접 준수하지 않을 때입니다.

struct Landmark1 {
    var id: Int
    var name: String
    var park: String
    var state: String
    var description: String
}

let landmarks1 = [
    Landmark1(id: 1, name: "Yosemite", park: "Yosemite National Park", state: "CA", description: "A great place to visit."),
    Landmark1(id: 2, name: "Grand Canyon", park: "Grand Canyon National Park", state: "AZ", description: "A major natural attraction.")
]

// SwiftUI View
struct LandmarkList: View {
    var body: some View {
        List(landmarks1, id: \\.id) { landmark in
            Text(landmark.name)
        }
    }
}

2. 데이터에 Identifiable 채택

각각의 데이터 요소가 고유 ID를 가지고 있는 것이기 때문에 바로 식별이 가능합니다.

struct Landmark: Identifiable {
    var id: Int
    var name: String
    var park: String
    var state: String
    var description: String
}

let landmarks = [
    Landmark(id: 1, name: "Yosemite", park: "Yosemite National Park", state: "CA", description: "A great place to visit."),
    Landmark(id: 2, name: "Grand Canyon", park: "Grand Canyon National Park", state: "AZ", description: "A major natural attraction.")
]

// SwiftUI View
struct LandmarkList: View {
    var body: some View {
        List(landmarks) { landmark in
            Text(landmark.name)
        }
    }
}

 

 

결과는 동일하게 나옵니다.

 

 

데이터를 식별하는 두 가지 방법 중 하나를 선택하면, 목록처럼 표현이 가능해집니다.

'💻' 카테고리의 다른 글

PNG와 JPEG의 차이  (2) 2024.09.05
Memory Leak 메모리 누수  (0) 2024.09.02
Virtual Memory 가상 메모리  (2) 2024.09.01
Split과 Components 차이  (0) 2024.08.30
final하면 왜 좋을까?  (1) 2024.08.29