Mengindeks di Listview.builder

Nov 11 2020

Respon yang saya dapatkan dari REST api saya terlihat seperti ini

{
    "result": {
        "newsfeed": [
            {
                "_id": "5fa52495f0e30a0017f4dccf",
                "video": null,
                "image": null,
                "author": [
                    {
                        "_id": "5f6a412d2ea9350017bec99f",
                        "userProfile": {
                            "visits": 0,
                            "bio": "Nothing for you ",
                            "gender": "Male",
                            "university": "Bells University Of Technology"
                        },
                        "name": "Jo Shaw ",
                        "__v": 0
                    }
                ],
                "text": "have you seen this ?",
                "campus": "Technology",
                "isLiked": false
            }
        ]
    }
}

Saya menggunakan FutureBuilder untuk menangani pengambilan data dan FutureBuilder mengembalikan ListView.builder yang saya gunakan untuk membangun tata letak saya tergantung pada jumlah item dalam respons

Ini adalah kode untuk UI saya

     return Scaffold(
        body: FutureBuilder<TimelineModel>(
          future: _future,
          builder: (context, snapshot) {
            switch (snapshot.connectionState) {
              case ConnectionState.none:
                return Text('none');
              case ConnectionState.waiting:
                return Center(
                  child: CircularProgressIndicator(),
                );
              case ConnectionState.active:
                return Text('');
              case ConnectionState.done:
                if (snapshot.hasError || snapshot.data == null) {
                  return Scaffold(
                    backgroundColor: Theme.of(context).backgroundColor,
                    body: Column(
                      children: [
                        Container(
                          child: Center(
                            child: Text("It's empty here"),
                          ),
                        ),
                      ],
                    ),
                  );
                }  else {
                  print("length: " +
                      snapshot.data.result.newsfeed.length.toString());
                  return RefreshIndicator(
                    onRefresh: _getData,
                    child: ListView(
                      children: [
                        ListView.builder(
                            itemCount: snapshot.data.result.newsfeed.length,
                            itemBuilder: (context, index) {
                              return Column(
                                      children: <Widgets>[
//This line of code works properly and no error is gotten 
                                    Text( snapshot.data.result.newsfeed[index].text),

//Once I put in this line of code, i receive a range error (RangeError (index): Invalid value: Only valid value is 0: 1)
                                  Text(snapshot.data.result.newsfeed[index].author[index].name),
                                 ],
                              );
                           }
                         )
                       ]
                     )
                   )
                 }
               }
             }
           )
         );

Ini adalah kesalahan yang terlihat ketika saya mencoba melakukan snapshot.data.result.newsfeed [index] .author [index] .name atau menggunakan salah satu item dalam objek di dalam array penulis

Jawaban

1 Pro Nov 12 2020 at 23:12

Seperti yang disebutkan @xion, Anda menggunakan newsfeedindeks untuk authorarray. Apa yang harus Anda lakukan adalah menetapkan semua penulis dalam setiap newsfeeditem ke string dan kemudian menggunakan nilai itu sebagai gantinya. Di bawah ini adalah kode untuk memberi Anda gambaran tentang apa yang harus Anda lakukan. Karena saya tidak memiliki akses ke API Anda, saya melakukan hardcode pada respons json Anda.

class MyApp extends StatefulWidget {
  MyApp({Key key, this.title}) : super(key: key);

  final String title;

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

class MyAppState extends State<MyApp> {
  var testJson = json.decode('''
  {
    "result": {
      "newsfeed": [
        {
          "_id": "5fa52495f0e30a0017f4dccf",
          "video": null,
          "image": null,
          "author": [
            {
              "_id": "5f6a412d2ea9350017bec99f",
              "userProfile": {
                "visits": 0,
                "bio": "Nothing for you ",
                "gender": "Male",
                "university": "Bells University Of Technology"
              },
              "name": "Jo Shaw ",
              "__v": 0
            },
            {
              "_id": "5f6a412d2ea9350017bec99f",
              "userProfile": {
                "visits": 0,
                "bio": "Nothing for you ",
                "gender": "Male",
                "university": "Bells University Of Technology"
              },
              "name": "Jo Shaw ",
              "__v": 0
            }
          ],
          "text": "have you seen this ?",
          "campus": "Technology",
          "isLiked": false
        }
      ]
    }
  }
  ''');

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            appBar: AppBar(
              title: Text(widget.title),
            ),
            body: Center(
              child: ListView(children: [
                ListView.builder(
                    scrollDirection: Axis.vertical,
                    shrinkWrap: true,
                    itemCount: testJson["result"]["newsfeed"].length,
                    itemBuilder: (context, index) {
                      String authors = '';
                      List<dynamic> authorsArray = testJson["result"]["newsfeed"][index]["author"];
                      for (int i = 0; i < authorsArray.length; i++) {
                        authors += i == (authorsArray.length - 1) ? authorsArray[i]["name"].toString() : authorsArray[i]["name"].toString() + ", ";
                      }
                      return Column(
                        children: [
                          Padding(
                            padding: EdgeInsets.all(10.0),
                            child: Text(
                              "Title: " +
                                  testJson["result"]["newsfeed"][index]["text"],
                              style: TextStyle(
                                  fontWeight: FontWeight.bold, fontSize: 18.0),
                            ),
                          ),
                          Text("Authors: " + authors,
                              style: TextStyle(
                                  color: Colors.black54,
                                  fontStyle: FontStyle.italic)),
                        ],
                      );
                    }),
              ]),
            ),
        ),
    );
  }
}

Tangkapan layar:

xion Nov 12 2020 at 07:03

penulis Anda mengakses indeks yang sama dengan umpan berita Anda

mungkin Anda harus membutuhkan pengulangan lain untuk penulis Anda

 ListView.builder(
                            itemCount: snapshot.data.result.newsfeed.length,
                            itemBuilder: (context, index) {
                              return Column(
                                      children: <Widgets>[
                                    Text( snapshot.data.result.newsfeed[index].text),
Text(snapshot.data.result.newsfeed[index].author[index].name), // <--- this line author[Index] hits error, not news the newsfeed
                                 ],
                              );
                           }
                         )