You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何将JSON数据匹配并展示在UITableViewCell的对应标签中?

没问题,我来一步步教你把JSON数据绑定到你的TableViewCell上,整个流程其实很清晰,咱们分几步来:

第一步:定义数据模型(用Codable简化JSON解析)

首先咱们得把JSON数据转换成Swift对象,这样后续操作会更安全、更易维护。iOS的Codable协议可以帮咱们自动完成解析,不用手动写字典转模型的逻辑。

假设你的JSON数据结构大概是这样的(如果实际结构有差异,调整模型字段即可):

[
  {
    "companyName": "Apple Inc.",
    "askPrice": 175.23,
    "lastPrice": 174.89,
    "bidPrice": 174.85,
    "highPrice": 176.10
  },
  {
    "companyName": "Google LLC",
    "askPrice": 142.50,
    "lastPrice": 142.30,
    "bidPrice": 142.25,
    "highPrice": 143.00
  }
]

对应的Swift模型代码如下:

struct StockModel: Codable {
    // 字段名要和JSON里的key完全匹配,如果不一致可以用CodingKeys映射
    let companyName: String
    let askPrice: Double
    let lastPrice: Double
    let bidPrice: Double
    let highPrice: Double
}

如果JSON里某些字段可能为null,记得把模型里对应的属性改成可选类型,比如let askPrice: Double?。

第二步:解析JSON数据

接下来要把JSON数据(不管是本地文件还是网络请求获取的)解析成咱们刚才定义的StockModel数组。

示例1:解析本地JSON文件

// 假设你的JSON文件名叫stocks.json,放在项目里
if let filePath = Bundle.main.path(forResource: "stocks", ofType: "json"),
   let jsonData = try? Data(contentsOf: URL(fileURLWithPath: filePath)),
   let stockList = try? JSONDecoder().decode([StockModel].self, from: jsonData) {
    // 解析成功,把数据存到数据源数组里
    self.stockDataSource = stockList
    // 刷新TableView
    self.tableView.reloadData()
}

示例2:解析网络请求的JSON数据

// 用URLSession发起网络请求
guard let url = URL(string: "你的接口地址") else { return }

URLSession.shared.dataTask(with: url) { data, response, error in
    guard let data = data, error == nil else {
        print("请求出错:\(error?.localizedDescription ?? "未知错误")")
        return
    }
    
    do {
        let stockList = try JSONDecoder().decode([StockModel].self, from: data)
        // 回到主线程刷新UI
        DispatchQueue.main.async {
            self.stockDataSource = stockList
            self.tableView.reloadData()
        }
    } catch {
        print("解析失败:\(error.localizedDescription)")
    }
}.resume()
第三步:在TableView数据源方法中绑定数据到Cell

现在要在你的ViewController里实现TableView的数据源方法,把模型里的数据赋值给Cell的各个Label。

首先在ViewController里声明数据源数组:

var stockDataSource: [StockModel] = []

然后确保ViewController遵守UITableViewDataSource协议,实现以下两个核心方法:

// 返回行数
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return stockDataSource.count
}

// 配置每个Cell
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    // 复用自定义Cell,注意这里的identifier要和Storyboard里Cell的identifier完全一致
    guard let cell = tableView.dequeueReusableCell(withIdentifier: "TableViewCell", for: indexPath) as? TableViewCell else {
        // 如果复用失败,返回一个默认Cell
        return UITableViewCell()
    }
    
    // 获取当前行对应的模型数据
    let currentStock = stockDataSource[indexPath.row]
    
    // 给各个Label赋值,这里可以格式化价格(比如保留两位小数)
    cell.CompanyLabel.text = currentStock.companyName
    cell.askPriceLabel.text = String(format: "%.2f", currentStock.askPrice)
    cell.lastPricelabel.text = String(format: "%.2f", currentStock.lastPrice)
    cell.bidPriceLabel.text = String(format: "%.2f", currentStock.bidPrice)
    cell.highPriceLabel.text = String(format: "%.2f", currentStock.highPrice)
    
    // 如果是可选值,要处理nil情况,比如:
    // cell.askPriceLabel.text = currentStock.askPrice.map { String(format: "%.2f", $0) } ?? "N/A"
    
    return cell
}
几个关键注意点
  • 确保Storyboard里的Cell的Identifier和代码里的dequeueReusableCell参数一致(比如上面的"TableViewCell")
  • 检查Cell里的所有IBOutlet是否正确连接到Storyboard的Label上,没有红色感叹号
  • 如果需要更专业的价格格式化(比如加货币符号),可以用NumberFormatter:
let priceFormatter = NumberFormatter()
priceFormatter.numberStyle = .currency
priceFormatter.currencyCode = "USD" // 根据你的需求设置货币代码
cell.askPriceLabel.text = priceFormatter.string(from: NSNumber(value: currentStock.askPrice))

内容的提问来源于stack exchange,提问作者Omar Diab

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.27 03:27:30