首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >以错误的方式实现SwiftUI .searchable?

以错误的方式实现SwiftUI .searchable?
EN

Stack Overflow用户
提问于 2022-11-16 09:33:19
回答 2查看 30关注 0票数 0

为了使用不同的视图,我尝试使用选项卡栏。在其中一些视图中,我有一个项目列表,我希望这个列表是.searchable。如果我访问每个视图并搜索,它的工作原理就像一个魅力,但是当我将其嵌入到选项卡式视图中时,列表就会变得对单击没有响应,但它会响应滚动手势。

我将用我拥有的代码和屏幕截图扩展这个想法,但我很确定问题在于我如何实现选项卡栏视图和具有可搜索修饰符的视图的组合:

这段代码运行良好。

代码语言:javascript
复制
import SwiftUI

struct ClientListView: View {
    @ObservedObject var viewModel = ClientFeedViewModel()
    @State var searchText: String
    @State private var showingSheet = false
    @State private var showList = false
    
    var clients: [Client] {
        if searchText.count > 2 {
            return searchText.isEmpty ? viewModel.clients : viewModel.search(withText: searchText)
        }
        return viewModel.clients
    }
    
    init(){
        searchText = ""
    }
    
    var body: some View {
        NavigationView {
                List(clients) { client in
                    NavigationLink(destination: {
                        
                    }, label: {
                        VStack {
                            Text(client.clientName)
                        }
                    })
                    
                    .listRowSeparator(.hidden)
                }
                .searchable(text: $searchText)
                .listStyle(.plain)
        }
    }
}

struct ClientListView_Previews: PreviewProvider {
    static var previews: some View {
        ClientListView()
    }
}

当我这样做并在选项卡栏视图中实现ClientListView时,问题就开始了:具有不同视图的选项卡条不能工作可搜索修饰符

这是Tab Bar视图的代码:

代码语言:javascript
复制
import SwiftUI

struct MainTabView: View {
    @EnvironmentObject var viewModel: AuthViewModel
    @Binding var selectedIndex: Int
    
    var body: some View {
        NavigationView {
            VStack {
                TabView(selection: $selectedIndex) {
                    ClientListView()
                        .onTapGesture {
                            selectedIndex = 0
                        }
                        .tabItem {
                            Label("Clients", systemImage: "list.bullet")
                        }.tag(0)
                    ProjectListView()
                        .onTapGesture {
                            selectedIndex = 1
                        }
                        .tabItem {
                            Image(systemName: "person")
                            Label("Projects", systemImage: "list.dash")
                        }.tag(1)
                    TaskListView()
                        .tabItem {
                            Image(systemName: "person")
                            Label("Tasks", systemImage: "list.dash")
                        }.tag(2)
                    
                        .onTapGesture {
                            selectedIndex = 2
                        }
                    ClientListView()
                        .tabItem {
                            Label("Settings", systemImage: "gear")
                        }.tag(3)
                        .onTapGesture {
                            selectedIndex = 3
                        }
                }
                
                .navigationTitle(tabTitle)
            }
            .toolbar {
                ToolbarItem(placement: .navigationBarLeading) {
                    Image("logo_silueta")
                        .resizable()
                        .scaledToFit()
                        .frame(width: 30, height: 30)
                }
                ToolbarItem(placement: .navigationBarTrailing) {
                    Button(action: {
                        viewModel.signOut()
                    }, label: {
                        Text("logout")
                    })
                    
                }
            }
            .navigationBarTitleDisplayMode(.inline)
        }
        
    }
    var tabTitle: String {
        switch selectedIndex {
        case 0: return "Clients"
        case 1: return "Projects"
        case 2: return "Tasks"
        case 3: return "Settings"
        default: return ""
        }
    
    }
    
}

struct MainTabView_Previews: PreviewProvider {
    static var previews: some View {
        MainTabView(selectedIndex: .constant(0))
    }
}

选项卡式视图上的导航有效,并在选项卡标题上显示不同的名称,但是当我单击搜索栏的cancel或x按钮时,它不起作用,列表也变得不可点击

到目前为止,我还没有找到问题出在哪里,但我假设是问题所在,因为选项卡条视图混淆了可搜索属性。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2022-11-16 10:19:43

罪魁祸首似乎是您的.onTapGesture修饰符,它将优先于子视图中的任何点击处理。

我不确定这些修饰符带来了什么值,因为使用适当的.tag值就足以让选项卡视图跟踪其所选的索引。我会从移除它们开始。

票数 0
EN

Stack Overflow用户

发布于 2022-11-16 14:11:18

@ObservedObject var viewModel = ClientFeedViewModel()是内存泄漏,请尝试将其更改为如下所示:

代码语言:javascript
复制
struct ClientListViewData {
    var searchText: String = ""
    var showingSheet = false
    var showList = false

    mutating func showSheet() {
        showingSheet = true
    }
}

struct ClientListView: View {
    @Binding var data: ClientListViewData
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/74458116

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档