Flutter – 'Expected a value of type List<dynamic> but got one type _JsonMap'

The code below has my List<dynamic> casting method, yet when I preview my code, the info displayed is that ‘Expected a value of type List<dynamic> but got one type _JsonMap’.

My data is being retrieved from a django rest framework into a json format. I run server whenever I start the flutter app. Yet The isn’t showing, just the error message is displayed in the center widget in flutter.

// ignore_for_file: dead_code, prefer_const_constructors, prefer_const_literals_to_create_immutables, deprecated_member_use, avoid_print, non_constant_identifier_names

import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:async';


Future<List<Data>> fetchData() async {
  var url = Uri.parse('http://127.0.0.1:8000/api/?format=json');
  final response = await http.get(url);
  if (response.statusCode == 200) {
    // final jSon = "[${response.body}]";
    List jsonResponse = (json.decode(response.body) as List<dynamic>);
    return jsonResponse.map((data) => Data.fromJson(data)).toList();
  } else {
    throw Exception('Unexpected error occured!');
  }
}



class Data {
  final int ID;
  final String visitor_name;
  final String visit_date;
  final String time_in;
  final String time_out;
  final String department;
  final String visitee_name;
  final String address;
  final String phone;
  final String purpose_of_visit;

  Data({required this.ID, required this.visitor_name, required this.visit_date, required this.time_in, required this.time_out, required this.department, required this.visitee_name, required this.address, required this.phone, required this.purpose_of_visit});

  factory Data.fromJson(Map<String, dynamic> json) {
    return Data(
      ID: json['ID'],
      visitor_name: json['visitor_name'],
      visit_date: json['visit_date'],
      time_in: json['time_in'],
      time_out: json['time_out'],
      department: json['department'],
      visitee_name: json['visitee_name'],
      address: json['address'],
      phone: json['phone'],
      purpose_of_visit: json['purpose_of_visit'],

    );
  }
}




class ViewRecord extends StatefulWidget {
  const ViewRecord({super.key});

  @override
  State<ViewRecord> createState() => _ViewRecordState();
}

class _ViewRecordState extends State<ViewRecord> {

  @override
  Widget build(BuildContext context) {
    return FutureBuilder<List<Data>>(
      future: fetchData(),
      builder: (context, snapshot) {
        if (snapshot.hasData) {
          return SingleChildScrollView(
              scrollDirection: Axis.vertical,
              child: SingleChildScrollView(
                scrollDirection: Axis.horizontal,
                child: DataTable(
                  decoration: BoxDecoration(
                    
                  ),
                  border: TableBorder.all( style: BorderStyle.solid, width: 2, borderRadius: BorderRadius.circular(5)),
                  columnSpacing: 50,
                  dataRowHeight: 50,
                  dividerThickness: 2,
                  headingRowColor: MaterialStateProperty.resolveWith((states) => Colors.lightBlue[50]),
                  columns: const <DataColumn>[
                          DataColumn(label: Text('ID')),
                          DataColumn(label: Text('Visitor's Name')),
                          DataColumn(label: Text('Visit Date')),
                          DataColumn(label: Text('Time In')),
                          DataColumn(label: Text('Time Out')),
                          DataColumn(label: Text('Department')),
                          DataColumn(label: Text('Visitee')),
                          DataColumn(label: Text('Address')),
                          DataColumn(label: Text('Phone')),
                          DataColumn(label: Text('Purpose of Visit')),
                  ], 
                 rows: List.generate(
                  snapshot.data!.length, 
                  (index) {
                    var data =  snapshot.data![index];
                    return DataRow(cells: [
                          DataCell(
                            Text(data.ID.toString())
                          ),
                          DataCell(
                            Text(data.visitor_name.toString())
                          ),
                          DataCell(
                            Text(data.visit_date.toString())
                          ),
                          DataCell(
                            Text(data.time_in.toString())
                          ),
                          DataCell(
                            Text(data.time_out.toString())
                          ),
                          DataCell(
                            Text(data.department.toString())
                          ),
                          DataCell(
                            Text(data.visitee_name.toString())
                          ),
                          DataCell(
                            Text(data.address.toString())
                          ),
                          DataCell(
                            Text(data.phone.toString())
                          ),
                          DataCell(
                            Text(data.purpose_of_visit.toString())
                          ),
                       ]
                    );
                  }
                  
                  ).toList(),
                  
                 ),
              ),
            );
          


        }
        else if (snapshot.hasError) {
          return Text(snapshot.error.toString());
        }
        return const CircularProgressIndicator();

      },
      
      );
  }
}