Bindingは、@Stateなどと同じプロパティラッパーの一つで、SwiftUIのデータ管理における重要な役割を持つ。
Bindingによって、あるビューで定義した状態変数を、別のビューで扱うことができるようになる。
具体例を見ていこう。
NavigationLinkを使って2つの画面を行き来するシンプルなアプリだ。
struct ContentView: View {
@State var order = ""
var body: some View {
NavigationView {
VStack {
Text(order)
NavigationLink(destination: InputTextView(text: $order)) {
Text("入力")
}
}
}
}
}
まずメインとなるビューを作成し、2行目で状態変数を定義する。
この状態変数を8行目で別のビュー(InputTextView)にバインドする。
次に、バインドする状態変数を受け取る側のビューを作成する。
struct InputTextView: View {
@Binding var text: String
var body: some View {
TextField("ここに入力してください", text: $text)
.padding()
.textFieldStyle(RoundedBorderTextFieldStyle())
}
}
2行目で、プロパティに@Bindingを付けるのがポイント。
プロパティに@Bindingを付けることで、先述のとおりビューを跨いで扱うことができるようになる。
このアプリを実行し、動作確認をおこなってみる。

「入力」ボタンをタップすると次のビューに遷移する。



テキストを入力し、元の画面に戻る。

入力した値が反映されており、バインドした状態変数が2つのビューで共有されていることが分かる。