如何获取这些类型的 json 数据列表

Question

#json 数据长这样

 {data: [{schoolid: CSRS0125, name: Aarungkhola Secondary School, logo: https://shikshya-app-bucket.s3.ap-south-1.amazonaws.com/uploads/thumbnail/, address: Madhyabindu - 10 , Nawalpur, contact: 078-555100, principalname: Bindu Kumar Shrestha, principalcontact: 9857024280, slogan: Education Discipline Civilization, web_address: , description: , email: aarungkholasecondaryschool2056@gmail.com, pan: 301862026, established_year: 1999}, {schoolid: CSRS0170, name: ABC Residential Secondary  School, logo: https://shikshya-app-bucket.s3.ap-south-1.amazonaws.com/uploads/thumbnail/abc logo_20210649041049.jpg, address: Nepalgunj-5, Banke, contact: 081536492, principalname: Shashi Swar, principalcontact: 9858021555, slogan: , web_address: , description: , email: abcrhssh@yahoo.com, pan: 302330122, established_year: 1990}, {schoolid: CSRS0020, name:.............

#我想访问所有数据列表，但我无法需要帮助这是我的模型类

HomePageModel homePageModelFromJson(String str) => HomePageModel.fromJson(json.decode(str));

String homePageModelToJson(HomePageModel data) => json.encode(data.toJson());

class HomePageModel with ChangeNotifier {
  List<Datum>? data;

  HomePageModel({this.data});


  factory HomePageModel.fromJson(Map<String, dynamic> json) => HomePageModel(
    data: List<Datum>.from(json["data"].map((x) => Datum.fromJson(x))),

  );

  Map<String, dynamic> toJson() => {
    "data": List<dynamic>.from(data!.map((x) => x.toJson())),
  };
}

class Datum with ChangeNotifier {
  Datum({
    this.schoolid,
    this.name,
    this.logo,
    this.address,
    this.contact,
    this.principalname,
    this.principalcontact,
    this.slogan,
    this.webAddress,
    this.description,
    this.email,
    this.pan,
    this.establishedYear,
  });

  String? schoolid;
  String? name;
  String? logo;
  String? address;
  String? contact;
  String? principalname;
  String? principalcontact;
  String? slogan;
  String? webAddress;
  String? description;
  String? email;
  String? pan;
  int? establishedYear;

  Datum.fromJson(Map<String, dynamic> json) {
    schoolid = json["schoolid"];
    name = json["name"];
    logo = json["logo"];
    address = json["address"];
    contact = json["contact"];
    principalname = json["principalname"];
    principalcontact = json["principalcontact"];
    slogan = json["slogan"];
    webAddress = json["web_address"];
    description = json["description"];
    email = json["email"];
    pan = json["pan"];
    establishedYear = json["established_year"];
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['schoolid'] = this.schoolid;
    data['name'] = this.name;
    data['logo'] = this.logo;
    data['address'] = this.address;
    data['contact'] = this.contact;
    data['principalname'] = this.principalname;
    data['principalcontact'] = this.principalcontact;
    data['slogan'] = this.slogan;
    data['web_address'] = this.webAddress;
    data['description'] = this.description;
    data['email'] = this.email;
    data['pan'] = this.pan;
    data['established_year'] = this.establishedYear;
    return data;
  }
}

#这是我访问我的 api 并尝试将提取的数据加载到我的列表中的类，如下所示。但问题是我只得到一个数据而不是我的_cItem中的数据列表

class HomePageModels with ChangeNotifier {
  List<HomePageModel> _cItem = [];
  List<HomePageModel> get cItem{
    return[..._cItem];
  }
  Future<List<HomePageModel>?> getHomeData()async{
    const url = "https://shikshyasoftware.com.np/CoreApplicationandAPIService-4617993073/api/school";
    final response = await http.get(Uri.parse(url));
    final extractedData = jsonDecode(response.body);
    print(extractedData);
    var loadedData =<HomePageModel>[];
    loadedData.add(HomePageModel.fromJson(extractedData));
    _cItem = loadedData;
    notifyListeners();
  }

#这就是我使用 ListView.builder 构建所有数据列表的方式

class HomePageGrid extends StatefulWidget {
  const HomePageGrid({Key? key}) : super(key: key);

  @override
  _HomePageGridState createState() => _HomePageGridState();
}

class _HomePageGridState extends State<HomePageGrid> {
  @override
  Widget build(BuildContext context) {
    final homeData = Provider.of<HomePageModels>(context);
    final data = homeData.cItem;
    return ListView.builder(itemCount: data.length,itemBuilder:(ctx,index)=>ChangeNotifierProvider.value(value:data[index],child:const HomePageDesign(),));
  }

}

#这是我为 listview.builder 设计的类

    class HomePageDesign extends StatefulWidget {
      const HomePageDesign({Key? key}) : super(key: key);
    
      @override
      _HomePageDesignState createState() => _HomePageDesignState();
    }
    
    class _HomePageDesignState extends State<HomePageDesign> {
      @override
      Widget build(BuildContext context) {
       final data = Provider.of<HomePageModel>(context);
        return Card(
          child: ListTile(
            leading: SizedBox(
                height: 50.0,
                width: 50.0,
                child: Image.network("${data.data![0].logo}")
            ),
            title: Text("${data.data![0].name}}"),
            // subtitle: Text("${homeData.data![0].address}"),
          ),
        );
      }
    }

#This is my class which renders the data in a list view 

class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  var _isInit = true;
  @override
  void didChangeDependencies() {
    // TODO: implement didChangeDependencies
    if(_isInit) {
      Provider.of<HomePageModels>(context).getHomeData();
    }
    _isInit = false;
    super.didChangeDependencies();
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.blue.shade400,
        title:const Text("Shikshya Shikshak"),
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children:[
         const Padding(
           padding: EdgeInsets.all(8.0),
           child: Text("Select you School",style: TextStyle(fontSize: 17.0),),
         ),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Form(
              child: Padding(
                padding: const EdgeInsets.only(left:2.0),
                child: Container(
                  height: 45.0,
                  width: 380.0,
                  decoration:BoxDecoration(
                    color:Colors.blueGrey.shade100,
                  ),
                  child: TextFormField(
                    textAlign: TextAlign.start,
                    decoration: const InputDecoration(
                        border: OutlineInputBorder(
                          borderSide: BorderSide.none,
                        ),
                        icon: Padding(
                          padding: EdgeInsets.only(left:5.0),
                          child: Icon(Icons.search),
                        ),
                        hintText:'Search School',
                        hintStyle:TextStyle(fontSize: 15.0)
                    ),
                  ),
                ),
              ),
            ),
          ),
          const SizedBox(height: 10.0),

          SizedBox(
            height: 500.0,
            width: 700.0,
            child: Column(
              children:const [
                Expanded(
                  child: Padding(
                    padding: EdgeInsets.only(left: 0),
                    child:HomePageGrid(),
                  ),
                )
              ],
            ),
          ),
        ],
      ),
    );
  }
}

#但现在的问题是我没有得到数据列表，而是我只得到一个数据，或者我们可以只说列表的第一个数据，但我想得到所有的列表，我陷入了这个问题需要帮助谢谢提前！

Answer 1

在您的代码中：

var loadedData =<HomePageModel>[];
loadedData.add(HomePageModel.fromJson(extractedData));

这将导致loadedData 成为一个列表，其中只有一项：您从extractedData 创建的HomePageModel。 HomePageModel 在其 data 字段中有 Datum 项目的列表。

所有这些都假设从您的 API 返回的 extractedData 只是一个 Datum 对象列表（Json 格式），它们共同代表一个 HomePageModel。

如果您希望 API 中包含 HomePageModel 对象的列表，那么您需要确保 extractedData 确实是这样一个列表，并解码该列表中的每个“HomePageModel”对象 - 这不是您的代码在做。