SwiftUI中Apple官方环境变量dismissSearch失效问题排查

问题现象 #

使用Apple官方文档的dismissSearch环境值时，点击键盘“Search”按钮仅键盘收起，搜索栏既未清空也未退出激活状态；打印dismissSearch输出DismissSearchAction(state: nil)。

预期行为：点击Search按钮后，搜索栏退出激活状态、文本框清空，同时显示带齿轮图标的导航栏。

问题代码 #

struct GroceryListView2: View {
    @Environment(\.dismissSearch) private var dismissSearch
    @State private var searchQuery = ""

    var body: some View {
        NavigationView {
            Text("Hi")
                .navigationBarItems(
                    trailing:
                        Button(action: {}, label: { Image(systemName: "gear")})
                )
                .searchable(
                    text: $searchQuery,
                    placement: .navigationBarDrawer(displayMode: .automatic),
                    prompt: "Add or search"
                )
                .onSubmit(of: .search) {
                    print("onSubmit", dismissSearch) // DismissSearchAction(state: nil)
                    dismissSearch()
                }
        }
    }
}

成因分析 #

1. NavigationView兼容性问题：dismissSearch是iOS 16+为NavigationStack设计的环境功能，旧的NavigationView与新的搜索组件存在适配问题，导致dismissSearch无法获取到搜索栏的激活状态（表现为state: nil），调用后无法触发退出搜索的操作。

2. dismissSearch的功能局限：dismissSearch()的作用仅为退出搜索的激活状态，本身不会自动清空搜索文本，若需要清空文本需手动重置searchQuery。

3. 搜索栏放置方式的影响：使用.navigationBarDrawer的placement时，搜索栏的显示模式由displayMode: .automatic控制，仅调用dismissSearch()可能无法触发搜索栏的自动隐藏，需要配合文本清空和正确的导航容器才能达到预期效果。

修正方案 #

• 用iOS 16+的NavigationStack替代NavigationView，确保dismissSearch能正确绑定搜索状态；
• 在调用dismissSearch()时手动清空searchQuery；
• 使用新的toolbar API替代已弃用的navigationBarItems。

修正后代码：

struct GroceryListView2: View {
    @Environment(\.dismissSearch) private var dismissSearch
    @State private var searchQuery = ""

    var body: some View {
        NavigationStack {
            Text("Hi")
                .toolbar {
                    ToolbarItem(placement: .navigationBarTrailing) {
                        Button(action: {}, label: { Image(systemName: "gear") })
                    }
                }
                .searchable(
                    text: $searchQuery,
                    placement: .navigationBarDrawer(displayMode: .automatic),
                    prompt: "Add or search"
                )
                .onSubmit(of: .search) {
                    searchQuery = ""
                    dismissSearch()
                }
        }
    }
}

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