将用户输入的数据导入视图？答案

【问题标题】：Importing the data typed by the user to a view?将用户输入的数据导入视图？
【发布时间】：2021-07-16 22:25:06
【问题描述】：

在制作我的第一个金融应用程序的过程中，我希望用户在这个模态显示的视图中输入他们的信用卡名称和最后四个数字（可能更多信息，因为这是一个草稿），然后在卡片中看到索引，小部件外观。

struct CardListView: View {

@State var isPresentingAddModal = false

@State var emisorTarjeta = ""
@State var numeroTarjeta = ""


var headerView: some View {

    HStack {

        Text("Tus tarjetas")

        Spacer()

        Button("Añadir nueva") {
            self.isPresentingAddModal.toggle()
       
    }
    .sheet(isPresented: $isPresentingAddModal, content: {
        
        HStack {
            Text("Emisor de tarjeta")
            TextField("Seleccionar emisor de tarjeta", text: $emisorTarjeta)
        }
        
        HStack {
            Text("Número de tarjeta")
            TextField("Escribí tu número de tarjeta", text: $numeroTarjeta)
        }
        
        Button(action: {
            self.isPresentingAddModal.toggle()
            print("\(self.emisorTarjeta)")
            
        }, label: {
            Text("Añadir")
        })
        Spacer()
    })
}

现在的问题是如何将从两个文本字段输入的信息传递到将创建卡片的视图。 “Añadir”按钮目前用作关闭按钮而不是添加按钮，因为我不知道如何创建它。

（另外，很多代码如填充和背景颜色已被删除，以使其更清晰可见）

Enitre view of the homeView

Where the "añadir" button is

【问题讨论】：

标签： ios swift xcode swiftui

【解决方案1】：

有几种方法可以做到这一点。一种简单的方法是像这样使用“@State”和“@Binding”：

在“CardListView”中使用这个：

    @Binding var emisorTarjeta: String
    @Binding var numeroTarjeta: String

并在“CardViewCreator”中使用：

    @State var emisorTarjeta = ""
    @State var numeroTarjeta = ""

另一种方法是使用“ObservableObject”，像这样创建一个类：

class CardModel: ObservableObject {
    @Published var emisorTarjeta = ""
    @Published var numeroTarjeta = ""
}

在您的“CardViewCreator”或某些父视图中：

 @StateObject var cardModel = CardModel()

并像这样将其传递给“CardListView”：

 struct CardListView: View {
   @ObservedObject var cardModel: CardModel
     ...
 }

您也可以以类似的方式使用“EnvironmentObject”。这一切都取决于你的情况。我建议阅读“ObservedObject” 并使用它。

【讨论】：

【解决方案2】：

一个真正简单的方法是在点击添加按钮时传入一个闭包来运行。这是一个示例，它还显示了如何关闭显示的工作表

import SwiftUI

struct Card: Identifiable {
    let id = UUID()
    let provider: String
    let number: String
}

struct ContentView: View {
    @State private var cards = [Card]()
    @State private var showingSheet = false

    var body: some View {
        VStack {
            List(cards, rowContent: CardView.init)
            .padding(.bottom, 10)
            Button("Add") {
                showingSheet = true
            }
            .padding()
        }
        .sheet(isPresented: $showingSheet) {
            AddSheet(completion: addCard)
        }
    }

    func addCard(provider: String, number: String) {
        let newCard = Card(provider: provider, number: number)
        cards.append(newCard)
    }
}

struct CardView: View {
    let card: Card

    var body: some View {
        VStack(alignment: .leading) {
            Text(card.provider)
            Text(card.number)
        }
    }
}

struct AddSheet: View {
    @Environment(\.presentationMode) var presentationMode
    @State private var provider = ""
    @State private var number = ""
    let completion: (String, String) -> Void
    var body: some View {
        VStack {
            TextField("Provider", text: $provider).padding()
            TextField("Number", text: $number).padding()
            Button("Add") {
                completion(provider, number)
                presentationMode.wrappedValue.dismiss()
            }

        }
    }
}



struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

【讨论】：

【解决方案3】：

如果您想实际保存在文本字段中传递的信息，则必须将其保存在某个地方，然后在需要时获取它但这仅适用于您希望能够在获得后访问传递到卡片索引的信息关闭应用程序并再次打开它。

【讨论】：