You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

搜索状态下导航时.toolbar(.hidden)失效问题

解决SwiftUI搜索后导航工具栏隐藏失效的问题

这个问题的核心原因是:当搜索栏处于激活状态时,导航到详情页后系统会保留搜索栏的上下文,导致你添加的.toolbar(.hidden)被覆盖,无法生效。

这里提供两种可行的解决方式:

方式一:导航时重置搜索状态

在用户点击导航链接时清空搜索文本,提前取消搜索状态,确保详情页的工具栏隐藏逻辑正常生效。修改NavigationLink代码如下:

NavigationLink(value: name) {
    Text(name)
        .font(.title2)
}
.onTapGesture {
    searchedText = ""
}

这种方式简单直接,适合不需要保留搜索状态的场景。

方式二:强制隐藏详情页所有工具栏元素

如果需要保留搜索状态(比如返回列表页后仍能看到之前的搜索内容),可以在详情页视图中明确指定隐藏所有导航栏相关的工具栏区域,替换原有的.toolbar(.hidden):

.navigationDestination(for: String.self) { name in
    Text(name)
        .toolbar(.hidden, for: .navigationBar)
}

如果同时需要隐藏TabBar,可追加对应配置:

.toolbar(.hidden, for: .tabBar)

修改后的完整代码(采用方式二)

struct ContentView: View {
    @State var searchedText = ""
    let names = ["Diego", "Jake", "Pablo", "Michael", "Hugo", "Roberth", "Daniel", "Rodrigo"]
    var filteredNames: [String] {
        searchedText.isEmpty 
            ? names 
            : names.filter { $0.lowercased().contains(searchedText.lowercased()) }
    }

    var body: some View {
        NavigationStack {
            List(filteredNames, id: \.self) { name in
                NavigationLink(value: name) {
                    Text(name)
                        .font(.title2)
                }
            }
            .navigationDestination(for: String.self) { name in
                Text(name)
                    .toolbar(.hidden, for: .navigationBar)
            }
            .searchable(text: $searchedText)
        }
    }
}

注:修正了原代码中Struct大小写错误,同时将filterednames调整为符合Swift命名规范的驼峰式filteredNames。

内容的提问来源于stack exchange,提问作者DiegoMod1

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.14 18:35:03