Flutter - 6.13 Futures

이제 detail한 정보들을 가져와서 화면에 표시하도록 해볼 것이다.

이때, detail_screen.dart에다가 home_screen.dart에서 했던 것 처럼 하면 된다고 생각하면 안된다.
그러니까, 다음과 같이 하면 안된다.

class DetailScreen extends StatelessWidget {
  final String title, thumb, id;

  Future<WebtoonDetailModel> webtoon = ApiService.getToonById(id);

  const DetailScreen({
    super.key,
    required this.title,
    required this.thumb,
    required this.id,
  });

이렇게 단순히:

Future<WebtoonDetailModel> webtoon = ApiService.getToonById(id);

이렇게 하면 안된다.
왜 그럴까?

• webtoon property를 초기화 할 때에 다른 property인 id에 접근이 불가능하기 때문이다.
• final String title, thumb, id;
  • 이 부분은 단순히 DetailScreen class의 인수(member)들을 정의하고 초기화 하는 것이 전부이기 때문임.

''어떤 property를 초기화 할 때에 다른 property로는 접근이 불가능 함.''

그럼 어떻게 해야 할까?
해결방법은 다음의 순서대로 하면 된다.

1. StatelessWidget $\rightarrow$ StatefulWidget
   • 이렇게 하면 Future<WebtoonDetailModel> webtoon = ApiService.getToonById(id); 이 부분에 변화가 있다는 것을 알게 된다.
   • Future<WebtoonDetailModel> webtoon = ApiService.getToonById(widget.id);
   • 뿐만 아니라, 전체적으로 뭔가 차이가 있다는 것을 알 수 있는데, title, id같은 인자들을 출력하거나 사용할 때에 단순하게 title, id를 그대로 사용 했던 것이 widget.title, widget.id으로바뀌는 것을 볼 수 있다.
   • 이것은 StatefulWidget인 DetailScreen과 State widget인 _DetailScreenState으로 분리되어서 생기는 현상이다.
   • 'widget.'을 이용해서 State가 속한 StatefulWiddget의 데이터를 받아온다.
   • 즉, 부모의 인자를 사용하기 위해서 'widget.'을 앞에 붙여주자.
   • 하지만, 여전히 에러가 나타나는데, 이는 contructor에서 widget이 참조될 수 없기 때문임.
2. webtoon 변경
   • late Future<WebtoonDetailModel> webtoon;
     • 이렇게 나중에 선언하겠다고 쓰고
   •   @override

       void initState() {

         super.initState();

         webtoon = ApiService.getToonById(widget.id);

       }
     • 이렇게 initState안에서 초기화 해준다.

단순하게, 인자로 가져온 부분을 그대로 다른 class로 넘겨주는 방법을 사용할 수 없다고 생각하자.

*StatefulWidget을 사용한 이유는 initState를 사용하기 위함이다.

이유는 위에 적기는 했지만, 나도 정확히 이해는 못하겠다.
솔직히, 코드는 이런 부분은 그냥 그렇구나 하고 넘어가는 것이 더 좋은 방법인 것 같다.