Конструктор fromJson
Часть раздела Данные и сеть путешествия по Flutter на Coddy. Урок 17 из 27.
Читать user['name'] as String по всему приложению неудобно, а одна опечатка в ключе приводит к ошибке. Обычно для решения этой проблемы создают класс для данных с одним конструктором, который знает, как работать с JSON. Он называется fromJson:
class User {
User({required this.name, required this.age});
final String name;
final int age;
factory User.fromJson(Map<String, dynamic> json) {
return User(
name: json['name'] as String,
age: json['age'] as int,
);
}
}User.fromJson — это именованный конструктор, второй способ создать User. Слово factory позволяет конструктору выполнять код и return созданный им объект. Обычный конструктор не может ничего return.
Теперь JSON читается в одном месте. Остальная часть приложения получает настоящий User, у которого user.name — это String, а опечатка приведёт к ошибке компиляции вместо null:
final body = await fetch('/user');
return User.fromJson(jsonDecode(body));Почти в каждом приложении, которое взаимодействует с сервером, есть fromJson для каждого вида получаемых данных.
Задание
СложноВ профиле указано Unknown: loadUser игнорирует JSON. Добавь в User фабричный конструктор factory User.fromJson(Map<String, dynamic> json), который считывает name, email и age, и сделай так, чтобы loadUser возвращал User.fromJson(jsonDecode(body)). Импортируй dart:convert.
Попробуйте сами
import 'package:flutter/material.dart';
import 'api.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return const MaterialApp(
debugShowCheckedModeBanner: false,
home: ProfileScreen(),
);
}
}
class ProfileScreen extends StatefulWidget {
const ProfileScreen({super.key});
@override
State<ProfileScreen> createState() => _ProfileScreenState();
}
class _ProfileScreenState extends State<ProfileScreen> {
late Future<User> _user;
@override
void initState() {
super.initState();
_user = loadUser();
}
Future<User> loadUser() async {
final body = await fetch('/user');
print(body);
return User(name: 'Unknown', email: 'unknown', age: 0);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('Profile')),
body: Center(
child: FutureBuilder<User>(
future: _user,
builder: (context, snapshot) {
if (snapshot.hasError) {
return Text('Could not load: ${snapshot.error}');
}
if (snapshot.hasData) {
final user = snapshot.data!;
return Column(
mainAxisSize: MainAxisSize.min,
children: [
Text(
user.name,
style: const TextStyle(fontSize: 28, fontWeight: FontWeight.bold),
),
const SizedBox(height: 8),
Text(user.email, style: const TextStyle(fontSize: 18)),
const SizedBox(height: 8),
Text('${user.age} years old'),
],
);
}
return const CircularProgressIndicator();
},
),
),
);
}
}
class User {
User({required this.name, required this.email, required this.age});
final String name;
final String email;
final int age;
}
В этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.
Все уроки раздела Данные и сеть
1Future (асинхронные результаты)
Значение, которое появится позжеОжидание с async и awaitФункции, возвращающие FutureПрактический API Coddy3Когда вызовы завершаются ошибкой
Перехват ошибок с помощью tryВыбрасывание ошибкиОчистка с помощью finallyСостояние ошибки в FutureBuilderКнопка «Попробовать снова»Потренируйтесь самостоятельно: Онлайн-компилятор Flutter