Binding이란

개요

@Binding은 SwiftUI에서 상태(state)를 여러 뷰에서 공유하고 수정할 수 있도록 하는 속성 래퍼다. 상위 뷰가 가진 상태 변수를 하위 뷰에 전달해, 하위 뷰가 직접 해당 상태를 읽고 수정할 수 있게 해준다.

---

왜 필요한가?

SwiftUI는 상태 변화를 감지해 UI를 업데이트한다. 그러나 상태는 보통 단방향 데이터 흐름을 가진다. 즉, 상위 뷰가 하위 뷰로 값을 내려주지만, 하위 뷰가 그 값을 직접 바꾸려면 @Binding이 필요하다.

---

사용법

1. 상위 뷰에서 상태 선언

struct ParentView: View {
    @State private var isOn: Bool = false

    var body: some View {
        ToggleView(isOn: $isOn)  // $로 바인딩 전달
    }
}

2. 하위 뷰에서 바인딩 받기

struct ToggleView: View {
    @Binding var isOn: Bool

    var body: some View {
        Toggle("Toggle", isOn: $isOn)
    }
}

• $는 @State로 선언된 변수의 바인딩 참조를 의미한다.
• 하위 뷰는 @Binding으로 선언된 변수를 통해 상위 뷰 상태를 직접 읽고 수정 가능하다.

---

특징

• 값 복사가 아닌 참조 기반으로 상태를 공유한다.
• 상태 변경 시, 해당 상태를 참조하는 모든 뷰가 리렌더링된다.
• 하위 뷰에서 상태 변경이 곧 상위 뷰 상태 변경으로 연결된다.

---

실전 예시

struct ContentView: View {
    @State private var name: String = "John"

    var body: some View {
        VStack {
            Text("Hello, \(name)")
            NameEditor(name: $name)
        }
    }
}

struct NameEditor: View {
    @Binding var name: String

    var body: some View {
        TextField("Enter your name", text: $name)
            .textFieldStyle(.roundedBorder)
            .padding()
    }
}

• NameEditor는 name을 직접 수정할 수 있고, ContentView는 변경된 값을 바로 반영한다.

---

정리

• @Binding은 상위 뷰의 상태를 하위 뷰에 읽기/쓰기 가능하도록 연결하는 도구다.
• 단방향 데이터 흐름을 유지하면서도, 상태 공유와 수정이 편리해진다.
• SwiftUI 컴포넌트 간 상태 전달에 필수적인 개념이다.

---

@Binding을 적절히 활용하면 뷰 간 상태 동기화가 쉬워지고, 코드도 깔끔해진다. SwiftUI에서 상태 관리의 기본기를 다질 때 반드시 익혀야 하는 속성 래퍼다.