Flutter JSON转Dart Model类

封面图 • 2025-10-11 • Flutter

在 Flutter 中，将 JSON 数据转换为 Dart Model 类（即数据模型类）是一个常见的操作。你可以使用以下几种方法来实现：

---

## ✅ 方法一：**手动创建 Model 类**

假设你有如下 JSON 数据：

```json
{
  "name": "John",
  "age": 30,
  "isStudent": false,
  "hobbies": ["reading", "gaming"],
  "address": {
    "city": "New York",
    "zip": "10001"
  }
}
```

### 1. 创建对应的 Dart Model 类

```dart
class User {
  final String name;
  final int age;
  final bool isStudent;
  final List<String> hobbies;
  final Address address;

User({
    required this.name,
    required this.age,
    required this.isStudent,
    required this.hobbies,
    required this.address,
  });

factory User.fromJson(Map<String, dynamic> json) {
    return User(
      name: json['name'],
      age: json['age'],
      isStudent: json['isStudent'],
      hobbies: List<String>.from(json['hobbies']),
      address: Address.fromJson(json['address']),
    );
  }

Map<String, dynamic> toJson() {
    return {
      'name': name,
      'age': age,
      'isStudent': isStudent,
      'hobbies': hobbies,
      'address': address.toJson(),
    };
  }
}

class Address {
  final String city;
  final String zip;

Address({
    required this.city,
    required this.zip,
  });

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

Map<String, dynamic> toJson() {
    return {
      'city': city,
      'zip': zip,
    };
  }
}
```

---

## ✅ 方法二：**使用 `json_serializable` 和 `build_runner` 自动生成 Model 类**

这是更推荐的方式，适合大型项目或频繁更新的 JSON 数据。

### 步骤：

1. **添加依赖到 `pubspec.yaml`**

```yaml
dependencies:
  flutter:
    sdk: flutter
  json_annotation: ^4.8.0

dev_dependencies:
  build_runner: ^2.1.0
  json_serializable: ^6.5.0
```

2. **创建模型类并添加注解**

```dart
import 'package:json_annotation/json_annotation.dart';

part 'user.g.dart';

@JsonSerializable()
class User {
  final String name;
  final int age;
  final bool isStudent;
  final List<String> hobbies;
  final Address address;

User({
    required this.name,
    required this.age,
    required this.isStudent,
    required this.hobbies,
    required this.address,
  });

factory User.fromJson(Map<String, dynamic> json) => _$UserFromJson(json);
  Map<String, dynamic> toJson() => _$UserToJson(this);
}

@JsonSerializable()
class Address {
  final String city;
  final String zip;

Address({
    required this.city,
    required this.zip,
  });

factory Address.fromJson(Map<String, dynamic> json) => _$AddressFromJson(json);
  Map<String, dynamic> toJson() => _$AddressToJson(this);
}
```

3. **运行生成代码**

在终端执行：

```bash
flutter pub get
flutter pub run build_runner build
```

这会自动生成 `user.g.dart` 文件，包含 `fromJson` 和 `toJson` 方法。

---

## ✅ 方法三：**在线工具（推荐用于快速生成）**

如果你不想写代码，可以使用一些在线工具来根据 JSON 生成 Dart Model 类：

### 推荐网站：
- [https://javiercbk.github.io/json_to_dart/](https://javiercbk.github.io/json_to_dart/)
- [https://app.quicktype.io/](https://app.quicktype.io/)

### 使用步骤：
1. 粘贴你的 JSON 数据。
2. 选择语言为 **Dart**。
3. 点击 **Generate**。
4. 复制生成的代码即可使用。

---

## ✅ 总结

| 方法 | 优点 | 缺点 |
|------|------|------|
| 手动创建 | 简单直接 | 需要自己写 `fromJson` 和 `toJson` |
| `json_serializable` | 自动化、可维护性强 | 需要配置和构建 |
| 在线工具 | 快速生成 | 无法自定义逻辑 |

---

如果你需要我帮你把某个具体的 JSON 转成 Dart Model 类，可以直接发给我 JSON 内容，我来帮你生成。