'How to show only the result of a searchable of a List Swiftui

I'm donig a list numbers but i want to show only the result of my searchable not the whole list, how can i hide the list?

I was trying to change the state of a boolean when the searchtext was empty but xcode sends some warinigs like “Modifying state during view update, this will cause undefined behavior”

Thanks!

import SwiftUI
import UIKit

struct NumberList: View {
    
    @EnvironmentObject var network: Network
    @State private var searchText = ""

    
    var body: some View {
        NavigationView {
            List(searchResults, id: \.id) { phones in
                NavigationLink {
                    NumberDetail(phones: phones)
                } label: {
                    VStack(alignment: .leading) {
                        Text(phones.Number)
                            .bold()
                    }
                }
            }
            .task{
                network.getnumbers()
            }
            .searchable(text: $searchText)
            .navigationTitle("Numbers")
            .keyboardType(UIKeyboardType.numberPad)
        }

        .background(
             Image("background")
                 .resizable()
                 .scaledToFill()
        )
        .opacity(0.75)
    }

    var searchResults: [phonesExt] {
        if searchText.isEmpty {
            return network.phones
        } else {
            return network.phones.filter { $0.number.contains(searchText) } 
        }
    }

}

struct DelegateApp: App {
    var body: some Scene { WindowGroup{ NumberList()}}
}
 
 struct NumberList_Previews: PreviewProvider {
     static var previews: some View {
         NumberList().environmentObject(Network())
     }
 }```


Solution 1:[1]

Searching a lot i found a lot of things and this works for me

I used the modifier onChange to see the state of my texfield

 var body: some View {
    NavigationView {
        List(searchResults, id: \.id) { phones in
            NavigationLink {
                NumberDetail(phones: phones)
            } label: {
                VStack(alignment: .leading) {
                    Text(phones.Number)
                        .bold()
                }
            }
        }
        .listStyle(.plain)
        .searchable(text: $searchText)
        .onChange(of: searchText) { value in
            if !value.isEmpty && value.count < 9 {
          //value belongs to searchtext so if the searchtext is empty value too
                network.getNumbers()
            }else {
                network.phones.removeAll()
                print("Clean the list")
               }
        }
        .navigationTitle("Numbers")
        .keyboardType(UIKeyboardType.numberPad)
    }

    .background(
         Image("background")
             .resizable()
             .scaledToFill()
    )
    .opacity(0.75)
}

Solution 2:[2]

There are some hints in Craft search experiences in SwiftUI that explains the isSearching environment variable. The code shown is very vague though.

enter image description here

NavigationView {
    WeatherList(text: $text) {
        ForEach(data) { item in
            WeatherCell(item)
        }
    }
}
.searchable(text: $text)

Note: I highly doubt the ForEach is where its shown, its more likely to be inside WeatherList or one of the sub-views.

struct WeatherList: View {
    @Binding var text: String
    
    @Environment(\.isSearching)
    private var isSearching: Bool
    
    var body: some View {
        WeatherCitiesList()
            .overlay {
                if isSearching && !text.isEmpty {
                    WeatherSearchResults()
                }
            }
    }
}

Note: the fact he supplies a binding without needing write access makes me concerned this presenter does not know SwiftUI.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Rey21
Solution 2