如何处理ListView.builder中参数缺失导致的应用崩溃？

一、避免崩溃的核心处理方式 #

直接链式访问嵌套的可选字段会因为某一层为null导致崩溃，你可以用Dart的空安全操作符来处理：

1. 给可选字段设置默认值

用?.链式安全访问，配合??提供默认值，这样即使字段不存在也不会抛出异常：

ListView.builder(
  itemCount: taf.length,
  itemBuilder: (context, index) {
    final indicatorText = taf[index]['change']?['indicator']?['text'] ?? '无指标';
    return Card(
      child: Column(
        children: [
          Text('Indicator: $indicatorText'),
          Text('Valid from: ${taf[index]['timestamp']['from']}'),
          Text('Valid to: ${taf[index]['timestamp']['to']}')
        ],
      ),
    );
  },
),

这里?.会在某一层为null时直接返回null，??则会把null替换成你指定的默认文本。

2. 条件渲染该组件

如果不想显示默认文本，而是完全隐藏这个Text组件，可以在Column的children里用条件判断：

ListView.builder(
  itemCount: taf.length,
  itemBuilder: (context, index) {
    final indicatorText = taf[index]['change']?['indicator']?['text'];
    return Card(
      child: Column(
        children: [
          // 只有字段存在时才渲染这个Text
          if (indicatorText != null) Text('Indicator: $indicatorText'),
          Text('Valid from: ${taf[index]['timestamp']['from']}'),
          Text('Valid to: ${taf[index]['timestamp']['to']}')
        ],
      ),
    );
  },
),

二、构建不规则元素列表的替代方案 #

1. 使用实体类（推荐）

把JSON数据转成Dart实体类，用json_serializable包自动生成序列化代码，这样能明确哪些字段是可选的（用?标记），代码可读性和安全性都会提升：

// 定义实体类
class TafModel {
  final Change? change;
  final Timestamp timestamp;

  TafModel({this.change, required this.timestamp});

  factory TafModel.fromJson(Map<String, dynamic> json) {
    return TafModel(
      change: json['change'] != null ? Change.fromJson(json['change']) : null,
      timestamp: Timestamp.fromJson(json['timestamp']),
    );
  }
}

class Change {
  final Indicator? indicator;

  Change({this.indicator});

  factory Change.fromJson(Map<String, dynamic> json) {
    return Change(
      indicator: json['indicator'] != null ? Indicator.fromJson(json['indicator']) : null,
    );
  }
}

class Indicator {
  final String text;

  Indicator({required this.text});

  factory Indicator.fromJson(Map<String, dynamic> json) {
    return Indicator(text: json['text']);
  }
}

class Timestamp {
  final String from;
  final String to;

  Timestamp({required this.from, required this.to});

  factory Timestamp.fromJson(Map<String, dynamic> json) {
    return Timestamp(from: json['from'], to: json['to']);
  }
}

之后在ListView里直接访问实体类的字段，空安全更有保障：

ListView.builder(
  itemCount: tafModels.length,
  itemBuilder: (context, index) {
    final model = tafModels[index];
    return Card(
      child: Column(
        children: [
          if (model.change?.indicator?.text != null) 
            Text('Indicator: ${model.change!.indicator!.text}'),
          Text('Valid from: ${model.timestamp.from}'),
          Text('Valid to: ${model.timestamp.to}')
        ],
      ),
    );
  },
),

2. 封装自定义列表项Widget

把每个列表项的逻辑抽成单独的Widget，让ListView的代码更简洁，也方便维护不规则的布局：

class TafItem extends StatelessWidget {
  final Map<String, dynamic> tafData;

  const TafItem({super.key, required this.tafData});

  @override
  Widget build(BuildContext context) {
    final indicatorText = tafData['change']?['indicator']?['text'];
    return Card(
      child: Column(
        children: [
          if (indicatorText != null) Text('Indicator: $indicatorText'),
          Text('Valid from: ${tafData['timestamp']['from']}'),
          Text('Valid to: ${tafData['timestamp']['to']}')
        ],
      ),
    );
  }
}

// 使用时
ListView.builder(
  itemCount: taf.length,
  itemBuilder: (context, index) => TafItem(tafData: taf[index]),
),

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