@Binding 属性

本课属于 Coddy Swift 学习旅程的“SwiftUI 入门”单元。第 39 课，共 50 课。

屏幕变大时，你可以把它拆分成更小的视图。如果子视图必须更改父视图的状态，就声明一个 @Binding，而不是自己持有这个值：

struct VolumeControl: View {
    @Binding var volume: Int

    var body: some View {
        Stepper("Volume: \(volume)", value: $volume, in: 0...10)
    }
}

父视图保存 @State，并通过 $ 将它的绑定传递下去：

struct ContentView: View {
    @State private var volume = 5

    var body: some View {
        VStack {
            VolumeControl(volume: $volume)
            Text(volume == 0 ? "Muted" : "Playing")
        }
    }
}

有一个值由 ContentView 持有。子视图中的步进器通过绑定修改这个值，父视图的文本也会随之更新。@State 持有一个值；@Binding 从其他地方借用一个值。

挑战

中等

ThemeToggle 应切换父视图的 darkMode。将它的属性改为 @Binding，把 Toggle 绑定到该属性，并从 ContentView 传入 $darkMode。开关打开时，文本必须显示 Dark theme。

亲手试试

import SwiftUI

@main
struct CoddyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

自我测试

这节课包含一个小测验。开始学习即可作答，并记录你的进度。

SwiftUI 入门中的所有课

1简介

什么是 SwiftUI 应用文件

4修饰符

内边距背景修饰符顺序框架与形状回顾：徽章制作器

7列表

遍历可识别的项目列表添加项目回顾：购物清单

10项目：Coddy 咖啡馆

2显示内容

文本视图文本中的数字字体颜色 SF Symbols 回顾：价格标签

5状态与按钮

按钮 @State 属性真或假状态条件视图回顾：计分器

8导航

NavigationStack NavigationLink 传递数据工作表与警告框回顾：植物指南

11最终挑战

小费计算器待办事项列表判断真假游戏

3堆栈与布局

VStack HStack 对齐与间距 Spacer 与 ZStack 回顾：天气卡片

6用户输入

文本框切换开关步进器和滑块选择器回顾：订单表单

9共享数据

@Binding 属性可观察对象环境对象回顾：步数计数器

自己练习： SwiftUI 在线编辑器