[Flutter] List is not a subtype of type List 에러 해결하기

개요

Flutter에서 API 통신에 http 패키지를 사용합니다. Flutter에서 http 패키지를 사용하여 API를 호출하는 방법에 대해서는 아래 링크를 참고하시기 바랍니다.

[Flutter] http로 API 호출하기

Flutter에서는 보통 http 패키지를 통해 전달받은 데이터를 모델 클래스에 저장하여 사용합니다. http 패키지를 통해 전달받은 JSON 데이터를 모델 클래스로 저장하는 방법에 대해서는 아래의 공식 문서를 참고하시기 바랍니다.

공식 문서: Serializing JSON inside model classes

이번 블로그 포스트에서는 http 패키지로 데이터를 전달받아, 모델 클래스에 데이터를 변환하여 저장할 때 종종 발생하는 List<dynamic> is not a subtype of type List<String> 에러를 해결하는 방법에 대해서 알아보도록 하겠습니다.

타입 변환 에러

http 패키지를 통해 전달받은 데이터를 모델 클래스로 변환하여 사용할 때, 다음과 같이 fromJson 메서드를 사용하게 됩니다.

class ExampleModel {
  final List<String>? list;

  ExampleModel({this.list});

  factory ExampleModel.fromJson(Map<String, dynamic> json) =>
      ExampleModel(list: json['list']);
}

이때, Flutter는 JSON 데이터의 타입을 정확히 알 수 없으므로 JSON 안에 문자열 리스트 데이터를 List<dynamic>으로 인식하게 됩니다. 이 List<dynamic> 데이터를 List<String>?에 할당하려고 할 때, 다음과 같이 List<dynamic> is not a subtype of type List<String> 에러가 발생합니다.

Flutter - List<dynamic> is not a subtype of type List<String> error

에러 내용만을 확인하면 다음과 같습니다.

Exception has occurred.
_TypeError (type 'List<dynamic>' is not a subtype of type 'List<String>?')

해결 방법

이 문제를 해결하기 위해서는 데이터의 타입을 List<dynamic>에서 List<String>?으로 변환할 필요가 있습니다. 보통 타입 변환을 위해서 다음과 같이 수정하는 경우가 있습니다.

factory ExampleModel.fromJson(Map<String, dynamic> json) =>
      ExampleModel(list: json['list'] as List<String>?);

하지만, 여전히 다음과 같은 에러가 발생하는 것을 확인할 수 있습니다.

Flutter - List<dynamic> is not a subtype of type List<String> in type cast error

에러 내용만을 확인하면 다음과 같습니다.

Exception has occurred.
_TypeError (type 'List<dynamic>' is not a subtype of type 'List<String>? in type cast')

이를 수정하기 위해서는 다음과 같이 List<String>?으로 변환하는 과정이 필요합니다.

factory ExampleModel.fromJson(Map<String, dynamic> json) => ExampleModel(
      list: (json['list'] as List?).map((item) => item as String).toList());

이렇게 수정하면 다음과 같이 문제가 해결되는 것을 확인할 수 있습니다.

Flutter - Fix List<dynamic> is not a subtype of type List<String> error

완료

이번 블로그 포스트에서는 Flutter에서 http 패키지로 데이터를 전달받아, 모델 클래스에 데이터를 변환하여 저장할 때 발생하는 List<dynamic> is not a subtype of type List<String> 에러를 해결하는 방법에 대해서 알아보도록 하겠습니다. 여러분도 List<dynamic> is not a subtype of type List<String> 에러가 발생한다면, 이번 블로그 포스트를 참고하여 해결해보시기 바랍니다.

Github Sponsor

Buy me a coffee

제 블로그가 도움이 되셨나요? 하단의 댓글을 달아주시면 저에게 큰 힘이 됩니다!

앱 홍보

지금 보고 계신 블로그를 작성하는 Deku가 개발한 앱을 한번 사용해보세요.
Deku가 개발한 앱은 Flutter로 개발되었습니다.

관심있으신 분들은 앱을 다운로드하여 사용해 주시면 정말 감사하겠습니다.

책 홍보

스무디 한 잔 마시며 끝내는 React Native 책을 출판한지 벌써 2년이 다되었네요.
이번에도 좋은 기회가 있어서 스무디 한 잔 마시며 끝내는 리액트 + TDD 책을 출판하게 되었습니다.

아래 링크를 통해 제가 쓴 책을 구매하실 수 있습니다.
많은 분들에게 도움이 되면 좋겠네요.