69 votes

Comment détecter les changements en direct sur TextField dans SwiftUI ?

J'ai un simple TextField qui se lie à l'état "emplacement" comme ceci,

 TextField("Search Location", text: $location)

Je veux appeler une fonction à chaque fois que ce champ change, quelque chose comme ceci :

 TextField("Search Location", text: $location) {
   self.autocomplete(location)
}

Cependant cela ne fonctionne pas. Je sais qu'il y a des rappels, onEditingChanged - mais cela ne semble être déclenché que lorsque le champ est focalisé.

Comment puis-je faire appeler cette fonction à chaque fois que le champ est mis à jour ?

84voto

kontiki Points 633

Vous pouvez créer une liaison avec une fermeture personnalisée, comme ceci :

 struct ContentView: View {
    @State var location: String = ""

    var body: some View {
        let binding = Binding<String>(get: {
            self.location
        }, set: {
            self.location = $0
            // do whatever you want here
        })

        return VStack {
            Text("Current location: \(location)")
            TextField("Search Location", text: binding)
        }

    }
}

31voto

superpuccio Points 572

Une autre solution, si vous devez travailler avec un ViewModel , pourrait être :

 import SwiftUI
import Combine

class ViewModel: ObservableObject {
    @Published var location = "" {
        didSet {
            print("set")
            //do whatever you want
        }
    }
}

struct ContentView: View {
    @ObservedObject var viewModel = ViewModel()

    var body: some View {
        TextField("Search Location", text: $viewModel.location)
    }
}

16voto

pawello2222 Points 16

SwiftUI 1 & 2

Utiliser onReceive :

 import Combine
import SwiftUI

struct ContentView: View {
    @State var location: String = ""

    var body: some View {
        TextField("Search Location", text: $location)
            .onReceive(Just(location)) { location in
                // print(location)
            }
    }
}

6voto

Dave Levy Points 744

Ce que j'ai trouvé le plus utile, c'est que TextField a une propriété appelée onEditingChanged qui est appelée au début de l'édition et à la fin de l'édition.

                TextField("Enter song title", text: self.$userData.songs[self.songIndex].name, onEditingChanged: { (changed) in
               if changed {
                   print("text edit has begun")
               } else {
                   print("committed the change")
                   saveSongs(self.userData.songs)
               }

           }).textFieldStyle(RoundedBorderTextFieldStyle())
               .font(.largeTitle)

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X