如何在視圖中將此本地JSON檔案中的陣列顯示為SwiftUI串列？

例如，如何顯示串列中每條記錄的描述符，例如：

• 堅果味，水果味
• 胖子
• 果味

（請注意，我在模型中將描述符設為可選，因為陣列可能為空）

這是我的 JSON 檔案代碼，來自名為 flavors.json 的檔案：

[
    {
        "id": "U45773",
        "flavorGroup": "CASHEW",
        "name": "NATURAL CASHEW FLAVORING",
        "isBeer": true,
        "isSeltzer": true,
        "isNatural": true,
        "descriptors": ["NUTTY", "FRUITY"],
        "keywords": ["aromatic", "fattt-buttery", "brown", "nutty", "roasted", "creamy"]
    },
    {
        "id": "U63639",
        "flavorGroup": "BLACK WALNUT",
        "name": "NATURAL AND ARTIFICIAL WALNUT FLAVOR",
        "isBeer": true,
        "isSeltzer": false,
        "isNatural": true,
        "descriptors": ["FATTY"],
        "keywords": ["sweet", "molasses", "woody", "slight dried fruit (amber ale)"]
    },
    {
        "id": "562811",
        "flavorGroup": "APRICOT",
        "name": "NATURAL AND ARTIFICIAL APRICOT FLAVOR",
        "isBeer": true,
        "isSeltzer": false,
        "isNatural": true,
        "descriptors": ["FRUITY"],
        "keywords": ["juicy", "skunky", "peach", "floral", "slight green (sierra nevada pale ale)"]
    }
]

這是我的模型代碼：

struct Flavor: Codable, Identifiable {
    enum CodingKeys: CodingKey {
        case id
        case flavorGroup
        case name
        case isBeer
        case isSeltzer
        case isNatural
        case descriptors
        case keywords
    }
    let id, flavorGroup, name: String
    let isBeer, isSeltzer, isNatural: Bool
    let descriptors, keywords: [String]?
}

這是我的視圖模型代碼：

class ReadData: ObservableObject  {
    @Published var flavors = [Flavor]()
    init(){
        loadData()
    }
    func loadData()  {
        guard let url = Bundle.main.url(forResource: "flavors", withExtension: "json")
            else {
                print("Json file not found")
                return
            }
        let data = try? Data(contentsOf: url)
        let flavors = try? JSONDecoder().decode([Flavor].self, from: data!)
        self.flavors = flavors!   
    }    
}

這是我對視圖代碼的最佳嘗試：

struct DescriptorListView: View {
    @ObservedObject var datas = ReadData()
    var body: some View {
        List(datas.flavors) { item in
            ForEach(item.descriptors, id: \.self) { descriptor in
                Text("- \(descriptor)")
            }
        }
    }
}

它產生這些編譯器錯誤，我不明白如何修復：

可選型別“[String]?”的值 必須解包為“[String]”型別的值

使用 '??' 合并 當可選值包含“nil”時提供默認值

使用 '!' 強制解包 如果可選值包含“nil”則中止執行

uj5u.com熱心網友回復：

你非常接近你的嘗試。主要問題是這descriptors是一個Optional. 這意味著您必須以某種方式解開該可選值——我使用過if let，這是一種稱為“可選系結”的技術。

另一個問題是您當前的代碼將在不同的行上列出每個描述符。我使用joined代替將描述符連接在一起，并將它們顯示在一行中。

struct DescriptorListView: View {
    @ObservedObject var datas = ReadData()
    var body: some View {
        List(datas.flavors) { item in
            HStack {
                if let descriptors = item.descriptors {
                    Text(descriptors.joined(separator: ", "))
                } else {
                    Text("(no data)")
                }
            }
        }
    }
}

標籤：数组 json 列表 解析 迅捷

上一篇：如何從JSON中檢索獲取資料？

下一篇：Oracle-使用json_objectagg過濾JSON陣列