我无法使用此模型视图实现搜索栏答案

【问题标题】：I can't implement a search bar with this modelView我无法使用此模型视图实现搜索栏
【发布时间】：2022-01-17 07:37:08
【问题描述】：

我无法实现搜索栏，我想在 device.make 中进行搜索，但无论是使用旧搜索栏还是新的 searchable 实现，我都不知道该怎么做。

如果我有一个正常的数组，则没有问题，但在这种情况下，modelView 我总是会出错。

struct MedicalView: View {
    
    init() {
        modelView.getData()
    }
    
    @ObservedObject  var modelView = DevicesViewModel()
    @State var searchText = ""
    @State private var showingAlert = false

    var searchMake: [String] { // 1
        if searchText.isEmpty {
            return modelView.devices
        } else {
            return modelView.devices.filter { $0.localizedCaseInsensitiveContains(searchText) }
        }
    }

    var body: some View {
        NavigationView {
            // ScrollView {
            VStack {
                List (modelView.devices) { device in
                    HStack {
                        VStack {
                            Text(device.make)
                                .font(.system(size: 20, weight: .heavy, design: .rounded))
                            Text(device.model)
                                .font(.system(size: 20, weight: .heavy, design: .rounded))
                                .foregroundColor(.white)
                                .shadow(color: .black, radius: 1)
                            Text(device.type)
                                .font(.system(size: 16, weight: .heavy, design: .rounded))
                                .foregroundColor(.blue)...

// .....
                   
                    }
                }
            }
        }.listStyle(.plain)
            .searchable(text: $searchText)

【问题讨论】：

你能包含一个可编译的minimal reproducible example吗？此外，您似乎没有在任何地方使用searchMake...

标签： ios swift swiftui

【解决方案1】：

您可以尝试此示例代码中所示的方法：

struct Device: Identifiable {
    let id = UUID()
    var make = ""
    var model = ""
    var type = ""
}

class DevicesViewModel: ObservableObject {
    @Published var devices: [Device] = []
    
    init() {
        getData() // <--- here
    }
    
    func getData() {
        devices = [Device(make: "1", model: "model1", type: "type1"),
                   Device(make: "2", model: "model2", type: "type2"),
                   Device(make: "3", model: "model3", type: "type3")]
    }
}

struct MedicalView: View {
    @StateObject var modelView = DevicesViewModel() // <--- here
    
    @State var searchText = ""
    @State private var showingAlert = false
    
    var searchMake: [Device] { // <--- here
        if searchText.isEmpty {
            return modelView.devices
        } else {
            return modelView.devices.filter{ $0.make.lowercased().localizedCaseInsensitiveContains(searchText.lowercased()) } // <--- here
        }
    }
    
    var body: some View {
        NavigationView {
            VStack {
                List (searchMake) { device in  // <--- here
                    HStack {
                        VStack {
                            Text("\(device.make)")
                                .font(.system(size: 20, weight: .heavy, design: .rounded))
                            Text("\(device.model)")
                                .font(.system(size: 20, weight: .heavy, design: .rounded))
                                .foregroundColor(.white)
                                .shadow(color: .black, radius: 1)
                            Text("\(device.type)")
                                .font(.system(size: 16, weight: .heavy, design: .rounded))
                                .foregroundColor(.blue)
                        }
                    }
                }
            }.listStyle(.plain)
             .searchable(text: $searchText)
        }
    }
}

【讨论】：