• 欢迎访问开心洋葱网站,在线教程,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站,欢迎加入开心洋葱 QQ群
  • 为方便开心洋葱网用户,开心洋葱官网已经开启复制功能!
  • 欢迎访问开心洋葱网站,手机也能访问哦~欢迎加入开心洋葱多维思维学习平台 QQ群
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏开心洋葱吧~~~~~~~~~~~~~!
  • 由于近期流量激增,小站的ECS没能经的起亲们的访问,本站依然没有盈利,如果各位看如果觉着文字不错,还请看官给小站打个赏~~~~~~~~~~~~~!

SwiftUI 中一些和响应式状态有关的属性包装器的用途

其他 seesawgame 1785次浏览 0个评论

SwiftUI 借鉴了 React 等 UI 框架的概念,通过 state 的变化,对 View 进行响应式的渲染。主要通过 @State, @StateObject, @ObservedObject 和 @EnvironmentObject 等属性包装器 (property wrapper) 将属性包装成状态来实现。

@State 和 @StateObject

@State 和 @StateObject 是比较常用的属性包装器。

两者的区别是:

  • @State: 主要用于修饰值类型那种简单属性。
  • @StateObject: 和 @ObservedObject 一样,主要用于引用类型那种复杂属性。

举例说明。在一个 SwiftUI View 中声明属性:

@State var name: String

那么,每次 name 发生变化时,View 都会重新渲染。

但假如有一个类:

class Student {
    var name: String = ""
}

当它的实例被用 @State 修饰时:

@State var student: Student = Student()

则 View 不会随着 student.name 的变化而变化,因为实例 student 本身并没有发生变化。为了让 View 随 student 的属性变化,就要用到 @StateObject 来包装:

@StateObject var student: Student = Student()

同时还要给 Student 的属性添加 @Published 包装:

class Student: ObservableObject {
    @Published var name: String = Student()
}

如此,每次 student.name 发生变化时,View 就会随之重新渲染了。

@Binding 和 @ObjectBinding

有时候我们在子 View 中需要用到父 View 的属性,并且不仅仅单方面的显示,还要有双向的影响,即子 View 对属性的更改,能反应到父 View 上。

在以下情况下:

// Parent View
struct ForumView: View {
    @State var username: String = ""
    
    var body: some View {
        Text(username)
        InputView(name: username)
    }
}

// Child View
struct InputView: View {
    @State var name: String = ""
    
    var body: some View {
        Text(name)
        Button(action: {
            name = "Tom"
        }) {
            Text("Change Name")
        }
    }
}

// Preview: ForumView(username: "Jack")

父 View 虽然能把自己属性的值传给子 View,但是子 View 在改变其属性值时,仅能够改变它自身,而不能影响到父 View。若要影响到父 View,就需要用到 @Binding 了:

// Parent View
struct ForumView: View {
    @State var username: String = ""
    
    var body: some View {
        Text(username)
        InputView(name: $username)
    }
}

// Child View
struct InputView: View {
    @Binding var name: String
    
    var body: some View {
        Text(name)
        Button(action: {
            name = "Tom"
        }) {
            Text("Change Name")
        }
    }
}

// Preview: ForumView(username: "Jack")

此时,你通过子 View 改变的值 (name),就同时也能改变到父 View 的属性 (username) 了。

简而言之,@Binding 就是对其他属性的一种引用式的绑定。注意用法:它在声明时,不需要赋初始值,在用到时,要加前缀 $

@Binding 对应 @State,则 @ObjectBinding 便对应 @ObservedObject 和 @StateObject 了,毋庸赘言。

@ObservedObject 和 @StateObject

用 @ObservedObject 和 @StateObject 包装的属性都需要其对象类实现 ObservableObject 协议。本质上,他们都是用来让对象状态化的包装器。但在使用时,有一定区别。

简单地说,@ObservedObject 会在 View 每次被重新渲染时重新构造,它包装的 Model 是跟着 View 走的,而 @StateObject 则不会,它一旦被创建,就由 SwiftUI 接管,不会随着 View 的刷新渲染而重建。

为什么会这样,因为 View 作为 struct 是一个值类型的对象,他被销毁时,它内部的对象也会被销毁,而 @StateObject 等于是给 View 内部的对象加了一层保护,使其不受 View 生命周期的影响。

有时我们通过 NavigationView 来回切换页面,会发现 @StageObject 对象也被重置了,像是随着 View 刷新而重建一样,其实那是 SwiftUI 的行为。

比较而言,我觉得 @StateObject 更好,因为它和 View 解耦了,更方便控制。

@EnvironmentObject

@EnvironmentObject 有 @StateObject 那种脱离 View 生命周期的特性,但在使用上更为灵活。举例来说:

  • View A: 创建了 @StateObject var thing: Thing,包含 View B
  • View B: 包含 View C
  • View C: 需要用到 View A 的 thing 对象。

一般来说,为了让 View C 用到 View A 的 thing,就需要从 View A 开始传递 thing 给 View B, 再由 View B 传给 View C 使用。这是不是太麻烦了,View B 凭空多了一个它用不到但却能访问的对象 thing。@EnvironmentObject 的存在就是为了解决这个问题。

在 View A 中:

var thing: Thing = Thing(tag: "e")
var body: some View {
    NavigationView {
        ViewB()
    }.environmentObject(thing)
}

通过 .environmentObject(), thing 变成了环境对象。接下来我们在 View C 中就可以直接使用了:

@EnvironmentObject var thing: Thing
var body: some View {
    // thing.tag: "e"
    Text(thing.tag)
}

可以看到 View C 中 @EnvironmentObject var thing: Thing 不用初始化 thing,因为这个 thing 就是 ViewA 中的 thing。EnvironmentObject 就像把一个对象全局化了一样。

参考

本文主要参考了以下文章和视频:

  • @StateObject 和 @ObservedObject 的区别和使用
  • SwiftUI: @State vs @StateObject vs @ObservedObject vs @EnvironmentObject
  • When Should I Use @State, @Binding, @ObservedObject, @EnvironmentObject, or @Environment?
  • Sharing data across tabs using @EnvironmentObject – Hot Prospects SwiftUI Tutorial 10/16


开心洋葱 , 版权所有丨如未注明 , 均为原创丨未经授权请勿修改 , 转载请注明SwiftUI 中一些和响应式状态有关的属性包装器的用途
喜欢 (0)

您必须 登录 才能发表评论!

加载中……