Exception: type 'String' is not a subtype of type 'int' in type cast

Question

I am trying to list the users in flutter but i am getting the error that string is not a subtype of type int in type cast. I can't detect what part of the code is the causing the problem.

Model

class User {
  final int id;
  final String email;
  bool auth;
  User({this.id, this.email,});
  factory User.fromJSON(Map<String, dynamic> jsonMap) {
    return User(
      id: jsonMap['id'] as int,
      email: jsonMap['email'] as String,
    );}
  Map toMap() {
    var map = new Map<String, dynamic>();
    map["id"] = id;
    map["email"] = email;
    return map;}
  @override
  String toString() {
    var map = this.toMap();
    map["auth"] = this.auth;
    return map.toString();
  }}

Actual Part

Future<List<User>> fetchUsers(http.Client client) async {
  final response = await http.get("http://a6df36670036.ngrok.io/api/users/?format=json");
  return compute(parseUsers, response.body);
}
List<User> parseUsers(String responseBody) {
  final parsed = jsonDecode(responseBody).cast<Map<String, dynamic>>();
  return parsed.map<User>((json) => User.fromJSON(json)).toList();
}
class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
      ),
      body: FutureBuilder<List<User>>(
        future: fetchUsers(http.Client()),
        builder: (context, snapshot) {
          if (snapshot.hasError) print(snapshot.error);
          return snapshot.hasData
              ? UsersList(users: snapshot.data)
              : Center(child: CircularProgressIndicator());
        },
      ),
    );
  }
}
class UsersList extends StatelessWidget {
  final List<User> users;
  UsersList({Key key, this.users}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return ListView.builder(
      itemCount: users.length,
      itemBuilder: (context, index) {
        return Text(users[index].email);
      },
    );
  }
}

I think it is caused from id part of the model but i am not sure if it is actually id or not.

Is anybody able to help me?

Solution 1

The id from your API is a String so you need to change the id in your model to String

class User {
  final String id;
  final String email;
  bool auth;
  User({this.id, this.email,});
  factory User.fromJSON(Map<String, dynamic> jsonMap) {
    return User(
      id: jsonMap['id'] as String,
      email: jsonMap['email'] as String,
    );}
  Map toMap() {
    var map = new Map<String, dynamic>();
    map["id"] = id;
    map["email"] = email;
    return map;}
  @override
  String toString() {
    var map = this.toMap();
    map["auth"] = this.auth;
    return map.toString();
  }}

Solution 2

Inside your User Model Class, when you try to get an int value from a JSON file, instead of doing

id: jsonMap['id'] as int,

do it like

id: int.parse(jsonMap['id']) 

For your case , the code below should get you the id value as an int

return User(
  id: int.parse(jsonMap['id']),
  email: jsonMap['email'] as String,
);