SwiftUI：如何在ForEach循环中显示当前及之前项的累计总额

当前代码中，transactions.reduce(0) {$0 + $1.amount}会计算所有交易的总金额，导致每行的Total都显示同一个值。要实现逐行累计的效果，有两种常用方案：

方案一：提前计算累计总额数组 #

通过计算属性提前生成每个位置的累计总额，循环时直接取值，性能更优，适合数据量较大的场景：

import SwiftUI

struct NameAmount: Identifiable {
    let id = UUID()
    let name: String
    let amount: Double
}

struct ContentView: View {
    let transactions: [NameAmount] = [
        NameAmount(name: "A", amount: 100.50),
        NameAmount(name: "B", amount: 50.52),
        NameAmount(name: "C", amount: 85.65)
    ]
    
    // 预计算每行对应的累计总额
    private var cumulativeTotals: [Double] {
        var runningTotal = 0.0
        return transactions.map { item in
            runningTotal += item.amount
            return runningTotal
        }
    }
    
    var body: some View {
        VStack {
            List {
                // 用enumerated()获取索引，匹配对应的累计值
                ForEach(Array(transactions.enumerated()), id: \.element.id) { index, item in
                    HStack {
                        Text(item.name)
                        Text(String(format: "%.2f", item.amount))
                        Spacer()
                        Text("Total: \(String(format: "%.2f", cumulativeTotals[index]))")
                    }
                }
            }
        }
    }
}

方案二：循环内实时计算累计值 #

直接在循环中通过索引计算从第一个元素到当前元素的总和，写法更直观，适合数据量较小的场景：

import SwiftUI

struct NameAmount: Identifiable {
    let id = UUID()
    let name: String
    let amount: Double
}

struct ContentView: View {
    let transactions: [NameAmount] = [
        NameAmount(name: "A", amount: 100.50),
        NameAmount(name: "B", amount: 50.52),
        NameAmount(name: "C", amount: 85.65)
    ]
    
    var body: some View {
        VStack {
            List {
                ForEach(Array(transactions.enumerated()), id: \.element.id) { index, item in
                    HStack {
                        Text(item.name)
                        Text(String(format: "%.2f", item.amount))
                        Spacer()
                        // 计算当前行及之前所有元素的总和
                        let cumulativeTotal = transactions[0...index].reduce(0.0) { $0 + $1.amount }
                        Text("Total: \(String(format: "%.2f", cumulativeTotal))")
                    }
                }
            }
        }
    }
}

两种方案都能实现你想要的逐行累计效果，可根据实际数据规模选择合适的方式。

内容的提问来源于stack exchange，提问作者mzkn