将元素附加到数组后，它应该显示更多元素答案

【问题标题】：After appending element to array it should show more elements将元素附加到数组后，它应该显示更多元素
【发布时间】：2020-08-22 14:40:35
【问题描述】：

This is how it looks before and after..

我有一个 ForEach 循环，当我点击卡片时，它会在数组中附加一个新元素，然后它应该显示 2 张卡片。但是还有一张卡。（但我附加了新的卡片元素）那我该怎么办？

struct TimelineFromUserView: View {
    
    var card: [Card] = cardData
    
    var body: some View {
        
        VStack {
            HStack {
                Text("History").bold()
                    .font(.largeTitle)
                    .padding(.top, 20)
                    .padding(.leading, 20)
                Spacer()
                
            }
            Divider()
            ScrollView(.vertical, showsIndicators: false) {
                
                VStack(spacing: 30) {
                    ForEach(card) { item in
                        CardForTimeline(card: item)
                            .onTapGesture {
                                    print("juhuu")
                                    cardData.append(Card(number: 2, start: "01.10.2021", end: "20.10.2021", days: 19, success: false))
                                    print(cardData)
                            }
                        .padding()
                    }
                }
                .padding(.top, 10)
            }
        }
    }
}

struct Card: Identifiable{
    
    var id = UUID()
    var number: Int
    var start: String
    var end: String
    var days: Int
    var success: Bool
}

var cardData: [Card] = [
    Card(number: 1 ,start: "05.06.2020", end: "15.06.2020", days: 10, success: true)
]

【问题讨论】：

您是否会显示完整的视图变体，因为不清楚您如何存储和更新卡片？
就是这样。我没有更多代码。
问题是cardData不是@State变量。
@matt 所说的内容，加上您在ForEach() 中使用的名为card 的cardData 的副本，但您要附加到cardData 的原始版本。数组是 Swift 中的值类型，因此您在复制后对 cardData 所做的操作不会反映在复制中。
谢谢！你知道如何将 cardData 保存到 UserDefaults 吗？

标签： arrays swift swiftui

【解决方案1】：

您只需将数组cardData 的副本card 传递给ForEach，但如果我正确理解您的代码sn-ps，它应该是原始数组cardData。

如果这不是问题，发布更多代码会有所帮助。

【讨论】：

【解决方案2】：

我只是替换了 Text 上的 CardForTimeline（因为我没有您的 CardForTimeline），它返回了 2（我也替换了 print(cardData.count) 上的 print(cardData)）。您可以创建全新的项目并添加此代码。点击后会打印2、3、4、5

struct ContentView: View {
    
    var card: [Card] = cardData
    
    var body: some View {
        
        VStack {
            HStack {
                Text("History").bold()
                    .font(.largeTitle)
                    .padding(.top, 20)
                    .padding(.leading, 20)
                Spacer()
                
            }
            Divider()
            ScrollView(.vertical, showsIndicators: false) {
                
                VStack(spacing: 30) {
                    ForEach(card) { item in
                        Text(verbatim: "we")
                            .onTapGesture {
                                    print("juhuu")
                                    cardData.append(Card(number: 2, start: "01.10.2021", end: "20.10.2021", days: 19, success: false))
                                print(cardData.count)
                            }
                        .padding()
                    }
                }
                .padding(.top, 10)
            }
        }
    }
}

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


struct Card: Identifiable{
    
    var id = UUID()
    var number: Int
    var start: String
    var end: String
    var days: Int
    var success: Bool
}

var cardData: [Card] = [
    Card(number: 1 ,start: "05.06.2020", end: "15.06.2020", days: 10, success: true)
]

【讨论】：

【解决方案3】：

问题是 SwiftUI 不知道更新视图。试着写

@State private var card: [Card] = [
    Card(number: 1 ,start: "05.06.2020", end: "15.06.2020", days: 10, success: true)
]

而不是： var card: [Card] = cardData。这应该可以工作，因为你告诉 SwiftUI 它应该在值更改时更新视图。

此外，您还必须将代码的添加部分更改为：

.onTapGesture {
   self.card.append(Card(number: 2, start: "01.10.2021", end: "20.10.2021", days: 19, success: false))
}

以上是一种使用本地@State 属性来管理状态的方法。您也可以使用带有卡片数组的可观察对象。这可能如下所示：

struct ContentView: View {
    @ObservedObject private var cardData = CardData()
    
    var body: some View {
        
        VStack {
            HStack {
                Text("History").bold()
                    .font(.largeTitle)
                    .padding(.top, 20)
                    .padding(.leading, 20)
                Spacer()
                
            }
            Divider()
            ScrollView(.vertical, showsIndicators: false) {
                
                VStack(spacing: 30) {
                    ForEach(cardData.cards) { card in
                        Text(card.id.uuidString)
                            .onTapGesture {
                                self.cardData.add(card: Card(number: 2, start: "01.10.2021", end: "20.10.2021", days: 19, success: false))
                            }
                        .padding()
                    }
                }
                .padding(.top, 10)
            }
        }
    }
}

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


struct Card: Identifiable{
    var id = UUID()
    var number: Int
    var start: String
    var end: String
    var days: Int
    var success: Bool
}

class CardData: ObservableObject {
    // store the cards and make sure its get-only from the outside
    @Published private(set) var cards = [
        Card(number: 1 ,start: "05.06.2020", end: "15.06.2020", days: 10, success: true)
    ]
    
    // MARK: - Intents for modifing the cards, add additional if needed
    
    func add(card: Card) {
        self.cards.append(card)
    }
}

希望对您的问题有所帮助

【讨论】：