flutter: получение JSON по HTTP и парсинг ответа
Для работы с http в dart нужно подключить пакет http. Для этого в файл pubspec.yaml в секцию dependencies добавляем строчку
http: ^0.12.0
После этого загружаем пакет командой
flutter packages get
В файле подключаем импорты
import 'package:http/http.dart' as http; import 'dart:convert';
Второй импорт нужен будет для парсинга JSON из строки ответа.
Создаем класс с данными (в примере это данные пользователя)
class User { final int id; final String name; final String email; User({this.id, this.name, this.email}); factory User.fromJson(Map<String, dynamic> json) { return User( id: json['id'], name: json['name'], email: json['email'] ); } }
В классе User сделана фабрика для создания пользователя из JSON.
Добавляем в стейт виджета поле с данными пользователя
User _user;
Работа с HTTP происходит с помощью функций пакета http. Эти функции возвращают Future
void _updateData() { http.get('https://jsonplaceholder.typicode.com/users/1') .then(_processResponse); } void _processResponse(http.Response response) { if (response.statusCode == 200) { setState(() { _user = User.fromJson(json.decode(response.body)); }); } }
Здесь мы отправляем запрос, и, когда он приходит, проверяем код статуса и сохраняемв стейт десериализованное значение пользователя.
Осталось добавить виджеты для отображения
Text( _user?.id?.toString() ?? '', ), Text( _user?.name ?? '', ), Text( _user?.email ?? '', ), ... floatingActionButton: FloatingActionButton( onPressed: _updateData, child: Icon(Icons.add), ),
Все, теперь по нажатию на кнопку в виджет загружаются данные пользователя