如何使用 onCommit - SwiftUI

Question

我使用純 SwiftUI 構建了一個搜索欄，它接受輸入並使用.onCommit 查詢電影數據庫 API 並通過 SearchViewModel 中的 @Published 將數據發布到 SearchView。

我從 API 取回數據（我可以通過打印語句看到這一點），但 SearchView 從不刷新以顯示結果。 我在下面包含了我的代碼。

搜索視圖

import SwiftUI

struct SearchView: View {
    
    @ObservedObject var searchVM = SearchViewModel()
    
    @State private var searchText = "Star+trek"
    
    var body: some View {
        
        NavigationView {
            
            VStack {
                
                SearchBarView(text: $searchText)
                
                List {
                    
                    ForEach(searchVM.searchedMovies, id: \.id) { movie in
                        
                        NavigationLink(destination: MovieDetailView(movie: movie)) {
                            
                            MovielistRowView(movies: movie)
                        }
                        
                    }
                }
            }
            .navigationBarTitle("Search")
        }
    }
}

搜索欄視圖

import SwiftUI

struct SearchBarView: View {
    
    @ObservedObject var searchVM = SearchViewModel()
    
    @Binding var text: String
    
    @State private var isEditing = false
    
     var body: some View {
        
            HStack {
     
                TextField("Search for a movie", text: $text,
                          onCommit: {
                            self.searchVM.fetchMovies(movie: self.text)
                })
                    .padding(7)
                    .padding(.horizontal, 25)
                    .background(Color(.systemGray6))
                    .cornerRadius(8)
                
                    
                    // Add search icon and cross icon
                    .overlay(
                        HStack {
                            Image(systemName: "magnifyingglass")
                                .foregroundColor(.gray)
                                .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
                                .padding(.leading, 8)
                     
                            if isEditing {
                                Button(action: {
                                    self.text = ""
                                }) {
                                    Image(systemName: "multiply.circle.fill")
                                        .foregroundColor(.gray)
                                        .padding(.trailing, 8)
                                }
                            }
                        }
                    )
                    .padding(.horizontal, 10)
                    .onTapGesture {
                        self.isEditing = true
                    }
     
                if isEditing {
                    Button(action: {
                        self.isEditing = false
                        self.text = ""
                        
                        // Dismiss the keyboard
                        UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil)
     
                    }) {
                        Text("Cancel")
                        
                    }
                    .padding(.trailing, 10)
                    .transition(.move(edge: .trailing))
                    .animation(.default)
                }
            }
        }
    }

搜索視圖模型

import Foundation

class SearchViewModel: ObservableObject {
    
    @Published var searchedMovies = [Movie]()
    
    private var fetchedMovies = [MovieList]()
    
    func fetchMovies(movie: String) {
        
        WebService().searchForMovie(movie: movie) { movie in
            
            if let movie = movie {
                
                self.fetchedMovies.append(movie)
                
                for movie in movie.movies {
                    
                    self.searchedMovies.append(movie)
                }
            }
        }
    }
}

任何幫助將不勝感激！

Answer 1

問題是您使用了兩個不同的 SearchViewModel 實例。 您在 SearchView 中對其進行初始化，然后在 SearchBarView 中再次執行此操作。

我建議您將 SearchViewModel 作為參數傳遞給 SearcBarView，以便當您的 @Published 變量 searchedMovies 更新時，SearchView 會捕獲這些更新。