Flujo de datos de SwiftUI

pregunta

1. Cómo se vinculan la vista y los datos de dos vías, y cómo se actualiza View con los cambios de datos
2. ciclo de vista y declaración de datos
3. Cómo compartir datos entre diferentes vistas
4. @State @Binding @StateObject @ObserverableObject @ObserveredObject @EnvirmentObject 区别

Por qué necesita SwiftUI

graph TD
Code --> initialView 
Code --> updateView
updateView --> updateVieww
updateView --> updateData

Por lo general, cuando codificamos la página de códigos, la ruta de código no es una ruta única. En muchos casos, los datos y la vista no están unificados, lo que genera problemas. Escribir código más fácil de mantener.

graph TD
code --> data 
data --> view

la ruta del código siggle, debe llamarse. Usamos SwiftUI no para optimizar el rendimiento, sino para mejorar la capacidad de mantenimiento del código. Usa frameworks para evitar problemas.

La estructura básica de SwiftUI

struct SomeView: View {
    var body: some View {
        Text(" some view ")
    }
}
复制代码

Todos los componentes de la vista son estructuras de tipo value , que se pueden reconstruir en cualquier momento. Si dicha estructura mantiene el estado de la página, cuando se actualice la página, ¿volverán todos los estados al estado predeterminado?

En este momento, necesitamos que aparezca nuestro contenedor de propiedades.

struct SomeView: View {
    @State var someState = false
    var someValue = ""
    var body: some View {
        Text(" some view ")
    }
}
复制代码

@Estado @Enlace

graph TD
ContentView --> SomeView持有someValue
ContentViewObject --> SomeViewObject持有someState

1. La vista no guarda las propiedades modificadas por @State, sino que se guardan por separado. Entonces, cuando la vista se reconstruye, el estado de la vista no se perderá.
2. Debido a que las propiedades en Swift son todos tipos de valores, ¿qué pasa si varias vistas quieren compartir el estado? En este momento, @binding necesita obtener una referencia a @state. para compartir datos.

struct SomeView: View {
    @State var someState = false
    var body: some View {
        OtherView(someState: $someState)
    }
}

struct OtherView: View {
    @Binding var someState: Bool
    var body: some View {
        Text("")
    }
}
复制代码

Si tengo mucho Estado, ¿cómo manejar? Aquí presentamos el concepto de StateObject

@StateObject @ObservedObject ObservableObject

Similar a @State que declara una sola propiedad, @StateObject puede decorar un objeto de estado complejo. Si la propiedad en el objeto de estado es State puede controlarse lo suficiente.

1. 遵循ObservableObject协议，使用@published来Wrapper需要响应视图响应的属性
2. value changed 必须在主线程

// 声明一个complexObject
class ComplexObject: ObservableObject {
    // 可相应视图rebuild的state
    @Published var someState = false
    var someValue = true
}

// 持有complexObject
struct SomeView: View {
    @StateObject var someStateObject = ComplexObject()
    var body: some View {
        OtherView(someStateObject: someStateObject)
    }
}

// 仅使用
struct OtherView: View {
    @ObservedObject var someStateObject: ComplexObject
    var body: some View {
        Text("")
    }
}
复制代码

这里有几个点讲一下

Q:为什么ComplexObject使用class

A: 因为ObservableObject必须遵循AnyObject,必须是class

Q: share State 不使用 $ 符号了

A: 因为是class，原本就是引用类型

Q: StateObject 和 ObservedObject的区别

A: 类似State 和 Binding，一个是持有使用状态，一个仅仅是使用状态

多视图share state需要视图初始化一个一个传递，也太麻烦了。所以引出我们的@EnvironmentObject

@EnvironmentObject

// 声明一个complexObject
class ComplexObject: ObservableObject {
    // 可相应视图rebuild的state
    @Published var someState = false
    var someValue = true
}

// 持有complexObject
struct SomeView: View {
    @StateObject var someStateObject = ComplexObject()
    var body: some View {
        //>>>>>>>>>>>>>>>>>>>>>>>看这里>>>>>>>>>>
        OtherView()
            .environmentObject(someStateObject)
        //
    }
}

// 仅使用
struct OtherView: View {
    //>>>>>>>>>>>>>>>>>>>>>>看这里
    @EnvironmentObject var someStateObject: ComplexObject
    
    var body: some View {
        Text("")
    }
}
复制代码

1. 使用environmentObject的midifier注入对象
2. 从EnvironmentObject取出对象

简单粗暴

参考

whats-the-difference-between-observedobject-state-and-environmentobject