반응형
Homescreen.dart 에서
Stateful위젯으로 변경한다.
async 함수.......
getTodaysToon()이 종료되는 것도 기다려야 한다.
가장 기본적인 데이터 fetching 방법을 알아봤고, 다음 시간에는 다른 방법을 보여주겠다고 한다.
api_service.dart
import 'dart:convert';
import 'package:http/http.dart' as http;
import 'package:toonflix/models/webtoon.dart';
class ApiService {
static const String baseUrl =
"https://webtoon-crawler.nomadcoders.workers.dev";
static const String today = "today";
static Future<List<WebtoonModel>> getTodaysToon() async {
List<WebtoonModel> webtoonInstances = [];
final url = Uri.parse('$baseUrl/$today');
final response = await http.get(url);
if (response.statusCode == 200) {
final List<dynamic> webtoons = jsonDecode(response.body);
for (var webtoon in webtoons) {
webtoonInstances.add(WebtoonModel.fromJson(webtoon));
}
return webtoonInstances;
}
throw Error();
}
}
home_screen.dart
import 'package:flutter/material.dart';
import 'package:toonflix/models/webtoon.dart';
import 'package:toonflix/services/api_service.dart';
class HomeScreen extends StatefulWidget {
const HomeScreen({super.key});
@override
State<HomeScreen> createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
List<WebtoonModel> webtoons = [];
bool isLoading = true;
void waitForWebtoons() async {
webtoons = await ApiService.getTodaysToon();
isLoading = false;
setState(() {});
//UI가 변경될 때 꼭 입력해야 함
}
@override
void initState() {
// TODO: implement initState
super.initState();
waitForWebtoons();
}
@override
Widget build(BuildContext context) {
print(webtoons);
print(isLoading);
return Scaffold(
appBar: AppBar(
centerTitle: true,
elevation: 3,
backgroundColor: Colors.white,
title: const Text("Today's toon",
style: TextStyle(
color: Colors.black,
)),
),
);
}
}
반응형
'Flutter > Flutter로 웹툰 앱 만들기' 카테고리의 다른 글
[노마드코더: Flutter 로 웹툰 앱 만들기] #6.7 ListView (0) | 2022.12.14 |
---|---|
[노마드코더: Flutter 로 웹툰 앱 만들기] #6.6 FutureBuilder (0) | 2022.12.13 |
[노마드코더: Flutter 로 웹툰 앱 만들기] #6.4 Recap (0) | 2022.12.13 |
[노마드코더: Flutter 로 웹툰 앱 만들기] #6.3 fromJson (0) | 2022.12.13 |
[노마드코더: Flutter 로 웹툰 앱 만들기] #6.2 Data Fetching (0) | 2022.12.03 |