I want to display my JSON data on my homepage but I have a problem. when I run an error message appears 'The following _TypeError was thrown building FutureBuilder(dirty, state: _FutureBuilderState#d0e99):' and (error: type 'List' is not a subtype of type 'Map<String, dynamic>' when I run it). I've been trying to find but I can't solve the problem.
Below is my sample JSON snippet (note: this is local JSON):
{
"restaurants": [{
"id": "rqdv5juczeskfw1e867",
"name": "Melting Pot",
"description": "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet.",
"pictureId": "https://restaurant-api.dicoding.dev/images/medium/14",
"city": "Medan",
"rating": 4.2,
"menus": {
"foods": [{
"name": "Paket rosemary"
},
{
"name": "Toastie salmon"
},
{
"name": "Bebek crepes"
},
{
"name": "Salad lengkeng"
}
],
"drinks": [{
"name": "Es krim"
},
{
"name": "Sirup"
},
{
"name": "Jus apel"
},
{
"name": "Jus jeruk"
},
{
"name": "Coklat panas"
},
{
"name": "Air"
},
{
"name": "Es kopi"
},
{
"name": "Jus alpukat"
},
{
"name": "Jus mangga"
},
{
"name": "Teh manis"
},
{
"name": "Kopi espresso"
},
{
"name": "Minuman soda"
},
{
"name": "Jus tomat"
}
]
}
},
]
}
Below is my restaurant file:
import 'dart:convert';
class RestaurantDetail {
late Restaurant restaurants;
RestaurantDetail({required this.restaurants});
RestaurantDetail.fromJson(Map<String, dynamic> json) {
restaurants = Restaurant.fromJson(json['restaurants']);
}
}
class Restaurant {
late String id;
late String name;
late String description;
late String pictureId;
late String city;
late double rating;
late Menus menus;
Restaurant({
required this.id,
required this.name,
required this.description,
required this.pictureId,
required this.city,
required this.rating,
required this.menus,
});
Restaurant.fromJson(Map<String, dynamic> json) {
id = json['id'];
name = json['name'];
description = json['description'];
pictureId = json['pictureId'];
city = json['city'];
rating = json['rating'];
menus = Menus.fromJson(json['menus']);
}
}
class Menus {
late Foods foods;
late Drinks drinks;
Menus({
required this.foods,
required this.drinks,
});
Menus.fromJson(Map<String, dynamic> json) {
foods = Foods.fromJson(json['foods']);
drinks = Drinks.fromJson(json['drinks']);
}
}
class Foods {
late String name;
Foods({required this.name});
Foods.fromJson(Map<String, dynamic> json) {
name = json['name'];
}
}
class Drinks {
late String name;
Drinks({required this.name});
Drinks.fromJson(Map<String, dynamic> json) {
name = json['name'];
}
}
List<RestaurantDetail> parseRestaurant(String? json) {
if (json == null) {
return [];
}
final List parsed = jsonDecode(json);
return parsed.map((json) => RestaurantDetail.fromJson(json)).toList();
}
Below is the homepage code:
import 'package:flutter/material.dart';
import 'package:restaurant/data/restaurant.dart';
import 'package:restaurant/style/theme.dart';
class HomePage extends StatelessWidget {
static const routeName = '/article_list';
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: kBackgroundColor,
body: FutureBuilder<String>(
future: DefaultAssetBundle.of(context)
.loadString('assets/local_restaurant.json'),
builder: (context, snapshot) {
final List<RestaurantDetail> restaurants =
parseRestaurant(snapshot.data);
return ListView.builder(
itemCount: restaurants.length,
itemBuilder: (context, index) {
return _buildRestaurantItem(context, restaurants[index]);
},
);
},
),
);
}
Widget _buildRestaurantItem(
BuildContext context, RestaurantDetail restaurantDetail) {
return ListTile(
contentPadding:
const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
leading: Image.network(
restaurantDetail.restaurants.pictureId,
width: 100,
),
title: Text(restaurantDetail.restaurants.name),
subtitle: Text(restaurantDetail.restaurants.city),
onTap: () {},
);
}
}
Map<String,dynamic>using theaskeyword: stackoverflow.com/questions/55789048/…List>Restaurant>Menu>Productinstead of genericMap?