Futurebuilder 里面的 expansiontile flutter

Question

I have a screen that consist of ExpansionTile and as we know that ExpansionTile has children property. The thing that I would like to do is I need to catch the trigger click of ExpansionTile , so when user click the ExpansionTile it will run FutureBuilder to get a data from API, is there a way to do that. Because until now... ExpansionTile always runs together with the children Here is part of the code

ExpansionTile(
children:[] //here.. I would like to call the data from api, when user click the expansiontile
                                            title: Text(
                                                "${dataAll["data"][i]["lowongan"]}",
                                                style: GoogleFonts.poppins(
                                                    fontWeight: FontWeight.w600,
                                                    color: isHovered ||
                                                            listLokerModel.value
                                                                .lokerState[i]
                                                        ? dark_button
                                                        : Colors.white,
                                                    fontSize: 20)),
                                            subtitle: Text(
                                                "${dataAll["data"][i]["start"]} - ${dataAll["data"][i]["end"]}",
                                                style: GoogleFonts.poppins(
                                                    color: isHovered ||
                                                            listLokerModel.value
                                                                .lokerState[i]
                                                        ? dark_button
                                                        : Colors.white,
                                                    fontSize: 16)),
                                            trailing: Icon(
                                              Icons.keyboard_arrow_down_sharp,
                                              color: isHovered ||
                                                      listLokerModel
                                                          .value.lokerState[i]
                                                  ? dark_button
                                                  : Colors.white,
                                            ))

Answer 1

Here's simple solution to it.

Inside ExpansionTile, children add FutureBuilder, refer below code, you will get an idea.

class MyWidget extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
  return ExpansionTile(title:Text('hello'),
   children:[
    FutureBuilder(
     builder: (ctx, snapshot) {

      if (snapshot.connectionState == ConnectionState.done) {
      // If we got an error
      if (snapshot.hasError) {
        return Center(
          child: Text(
            '${snapshot.error} occured',
            style: TextStyle(fontSize: 18),
          ),
        );

        // if we got our data
      } else if (snapshot.hasData) {
        // Extracting data from snapshot object
        final data = snapshot.data as String;
        return Center(
          child: Text(
            '$data',
            style: TextStyle(fontSize: 18),
          ),
        );
      }
    }

    // Displaying LoadingSpinner to indicate waiting state
    return Center(
      child: CircularProgressIndicator(),
    );
  },

  // Future that needs to be resolved
  // inorder to display something on the Canvas
  future: getData(),
  ),
]);
}
 Future<String> getData() {
  return Future.delayed(Duration(seconds: 2), () {
   return "I am data";
     // throw Exception("Custom Error");
 });
 }
}