CODEWITHSUNDEEP
flutter
rozerro
rozerro

Reputation: 7216

How to complete async operation in initState and update ui?

The longRequest() completes with a code 200, but ui displays 400 when the longRequest() is completed. What's wrong with this scenario?

class Parsit extends StatefulWidget {
  @override
  _ParsitState createState() => _ParsitState();
}

class _ParsitState extends State<Parsit> {
  int code = 400;

  @override
  void initState() {
    super.initState();
    setState(() {
      longRequest().then((value) => code = value);
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Center(
        child: Text('$code'),
      ),
    );
  }

  Future<int> longRequest() async {
    final response = await Requests.get('http://google.com');
    response.raiseForStatus();
    ...
    print(response.statusCode); // 200
    return response.statusCode;
  }
}

Upvotes: 0

Views: 62

Answers (2)

DNS
DNS

Reputation: 929

using FutureBuilder widget

class Parsit extends StatefulWidget {
  @override
  _ParsitState createState() => _ParsitState();
}

class _ParsitState extends State<Parsit> {
  Future<int> code;

  @override
  void initState() {
    super.initState();
    code = longRequest();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Center(
        child: FutureBuilder<int>(
          future: code,
          builder: (context, snaopshot) {
              if (snapshot.hasData)
                return Text(snapshot.data.toString());
              return CircularProgressIndicator();
      ),
    );
  }

  Future<int> longRequest() async {
    final response = await Requests.get('http://google.com');
    response.raiseForStatus();
    ...
    print(response.statusCode); // 200
    return response.statusCode;
  }
}

Upvotes: 0

Mohammad Shamsi
Mohammad Shamsi

Reputation: 571

you can with a boolean value check longRequest() is finished and for UI put a loading or something :

class Parsit extends StatefulWidget {
  @override
  _ParsitState createState() => _ParsitState();
}

class _ParsitState extends State<Parsit> {
  int code = 400;
  bool longRequestIsFinish = false

  @override
  void initState() {
    super.initState();
    longRequest().then((value) {
      setState(() {
         code = value;
         longRequestIsFinish  = true;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Center(
        child: longRequestIsFinish ? Text('$code') : LoadingWidget(),
      ),
    );
  }

  Future<int> longRequest() async {
    final response = await Requests.get('http://google.com');
    response.raiseForStatus();
    ...
    print(response.statusCode); // 200
    return response.statusCode;
  }
}

Upvotes: 1

Related Questions