如何在The Composable Architecture中用NavigationStackStore实现嵌套导航

问题原因 #

当前MoreView未将自身的导航路径（More.State.path）与NavigationStackStore绑定，导致点击NavigationLink无法触发页面跳转。顶层NavigationStackStore仅处理Media模块的路径状态，而More模块的独立路径状态需要单独绑定对应的NavigationStackStore。

修复方案 #

修改MoreView代码，将列表内容包裹在NavigationStackStore中，并添加目标页面的处理逻辑：

public struct MoreView: View {
    public init(store: StoreOf<More>) {
        self.store = store
    }
    
    @Bindable var store: StoreOf<More>
    
    public var body: some View {
        NavigationStackStore(store.scope(state: \.path, action: \.path)) {
            List {
                Section {
                    NavigationLink(
                        state: More.Path.State.history(History.State())
                    ) {
                        Cell(
                            title: "Record History",
                            icon: Image(systemName: "hand.raised.circle.fill")
                        )
                    }
                }
            }
            .navigationBarTitle("More", displayMode: .inline)
        } destination: { store in
            switch store.state {
            case .history:
                if let historyStore = store.scope(state: \.history, action: \.history) {
                    HistoryView(store: historyStore)
                }
            }
        }
    }
}

关键说明 #

• 通过store.scope(state: \.path, action: \.path)将More模块的路径状态和动作绑定到新的NavigationStackStore
• 在destination闭包中处理More.Path.State的history case，渲染对应的HistoryView
• 确保More reducer中的path已通过.forEach(\.path, action: \.path)正确处理（你的代码中已实现此逻辑）

修改完成后，点击MoreView中的"Record History"链接即可正常跳转到HistoryView。

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