昨天我們學會了 互動與彈出元件（Alert、Sheet、FullScreenCover、confirmationDialog、Popover），這些工具能讓 App 不只是顯示資訊，還能與使用者互動。

今天要來介紹狀態管理。在前面的章節中有提到SwiftUI為宣告式 ，指的是將 UI 與狀態事先綁定，當狀態改變時，畫面會自動更新，不需手動操作。

那今天我們先來看看兩個最常用的狀態綁定：

@State —— 單一 View 內的狀態

@State 適合在 單一畫面 (View) 中管理簡單的狀態，例如文字輸入、開關、計數器等。

@State private var count = 0  // 狀態變數

var body: some View {
    VStack {
        Text("目前數字：\(count)")
            .font(.title)

        Button("加一") {
            count += 1
        }
        .padding()
    }
}

當 count 改變時，SwiftUI 會自動重新繪製畫面。

@Binding —— 傳遞狀態給子 View

如果父畫面需要把某個狀態交給 子元件 修改，就可以用 @Binding。

struct BindingExampleView: View {

    @State private var name = "" // 使用者輸入的名字
    @State private var isLoggedIn = false  // 紀錄是否登入

    var body: some View {
        VStack {
            TextField("輸入名字", text: $name)
                .padding()
                .textFieldStyle(RoundedBorderTextFieldStyle())
            Button("登入") {
                if !name.isEmpty {
                    isLoggedIn = true
                } else {
                    isLoggedIn = false
                }
            }
            if isLoggedIn && !name.isEmpty {
                ChildView(name: $name, isLoggedIn: $isLoggedIn) // 傳給子元件
            }
        }
    }
}

struct ChildView: View {
    @Binding var name: String  // 接收父元件的狀態
    @Binding var isLoggedIn: Bool

    var body: some View {
        VStack {
            Text("歡迎 \(name)")
            Button("登出") {
                isLoggedIn = false
                name = ""
            }
        }
    }
}

點擊登入後

點擊登出後

在這個例子裡：

• 父元件控制登入的邏輯，把登入資訊傳給子元件。
• 子元件則能透過 @Binding 修改父元件的狀態（例如登出、清空名稱）。

今日小結

今天我們認識了 SwiftUI 狀態管理的兩個基礎工具：

• @State：管理「單一 View」內的狀態
• @Binding：讓「子 View」可以共享並修改父 View 的狀態

有了這兩個工具，就能開始建立會隨使用者互動而更新的 App。

明天我們會繼續介紹更進階的狀態管理工具 @ObservedObject 、@StateObject 以及 @EnvironmentObject ， 讓App 可以處理更大規模的資料與跨多畫面共享狀態。