SwiftUI与TCA中如何跨视图传递状态内的绑定变量？

针对你遇到的问题，在TCA（组合架构）中实现父子视图状态的双向绑定，需要遵循TCA的状态管理逻辑，不能直接传递SwiftUI原生的Binding类型，而是通过ViewStore生成绑定+父Reducer处理更新Action的方式实现，具体步骤如下：

1. 给父Reducer添加状态更新的Action #

首先在PlaceStore中新增一个Action，用于接收子视图传递回来的placeSelected更新：

struct PlaceStore: ReducerProtocol {
    struct State: Equatable { 
        var placeSelected: Place?
        var presentingCreatePlace: Bool = false
    }

    enum Action: Equatable {
        case setPresentingCreatePlace(Bool)
        // 新增：接收子视图的地点选择更新
        case updatePlaceSelected(Place?)
        // 其他原有Action...
    }

    func reduce(into state: inout State, action: Action) -> EffectTask<Action> {
        switch action {
        case .setPresentingCreatePlace(let isPresented):
            state.presentingCreatePlace = isPresented
            return .none
        case .updatePlaceSelected(let place):
            // 更新父状态的placeSelected
            state.placeSelected = place
            return .none
        // 处理其他Action...
        }
    }
}

2. 调整子视图Store的初始化逻辑 #

在PlaceView中弹出CreatePlaceView时，通过ViewStore的binding(get:send:)方法生成绑定，传递给CreatePlaceStore的初始状态：

struct PlaceView: View {
    let store: StoreOf<PlaceStore>

    var body: some View {
        WithViewStore(store) { viewStore in
            // 你的视图内容，比如触发弹出sheet的按钮
            Button("创建地点") {
                viewStore.send(.setPresentingCreatePlace(true))
            }
            .sheet(isPresented: viewStore.binding(get: \.presentingCreatePlace, send: PlaceStore.Action.setPresentingCreatePlace)) {
                CreatePlaceView(
                    store: Store(
                        initialState: CreatePlaceStore.State(
                            // 用ViewStore生成绑定，关联父状态和子状态
                            placeSelected: viewStore.binding(get: \.placeSelected, send: PlaceStore.Action.updatePlaceSelected)
                        ),
                        reducer: CreatePlaceStore()
                    )
                )
            }
        }
    }
}

3. 子Reducer的逻辑处理（可选） #

如果CreatePlaceStore需要处理本地的地点选择逻辑，可以在其Action中定义对应操作，修改@BindingState修饰的placeSelected，绑定会自动同步到父状态：

struct CreatePlaceStore: ReducerProtocol {
    struct State: Equatable {      
        @BindingState var placeSelected: Place?        
    }

    enum Action: Equatable {
        // 示例：本地选择地点的动作
        case selectPlace(Place)
    }

    func reduce(into state: inout State, action: Action) -> EffectTask<Action> {
        switch action {
        case .selectPlace(let place):
            // 修改子状态的placeSelected，绑定会自动同步到父状态
            state.placeSelected = place
            return .none
        }
    }
}

核心原理 #

• TCA的@BindingState属性包装器，用于将子Reducer的状态与父状态的一部分进行双向绑定，避免直接传递SwiftUI原生Binding破坏TCA的状态单向流原则。
• ViewStore.binding(get:send:)方法会将子状态的变化转换为父Action，通过父Reducer的处理更新父状态，保证状态变化完全处于TCA的管理流程中，可追踪、可测试。

内容的提问来源于stack exchange，提问作者Joan Cardona