Question

我是Flutter的新手，我想通过我的应用程序在从后端获取数据时获取ProgressBar指示器小部件，而在获取数据时又显示另一个信息小部件，我只是不知道该怎么做？

我尝试了下面的代码，它工作正常！但我不知道这是否是探查者的方法

import 'package:flutter/material.dart';
import 'dart:async';
import 'package:http/http.dart' as http;
import 'dart:convert' as convert;

class UserLocation extends StatefulWidget {


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



class _UserLocationState extends State<UserLocation> {

  bool isLoading;

  @override
    void initState() {
      isLoading = true;
      getData();
      super.initState();
    }
  @override
  Widget build(BuildContext context) {
    return makeBody(

    );
  }


  Widget indicator(){
    return Scaffold(

        backgroundColor: Colors.red,

    );
  }

  Widget showData(){
    return Scaffold(

        backgroundColor: Colors.green,

    );
  }

  Widget makeBody(){
      if(isLoading){
        return this.indicator();
      }else{
        return this.showData();
      }
  }

  Future getData() async{

      var response = await http.get(Uri.encodeFull('http://xxxx'));
      if(response.statusCode == 200){
            isLoading = false;
            setState(() {
              var jsonResponse = convert.jsonDecode(response.body);
              var data = jsonResponse['data'] as List;
             print(data);
            });


      }else{
        isLoading = false;
        print("Request failed with status: ${response.statusCode}.");
      }

    }
}

任何帮助，都会很感激

Answer 1

我认为您从API获取了200以外的响应代码，并且响应不是200时未使用setState

import 'package:flutter/material.dart';
import 'dart:async';
import 'package:http/http.dart' as http;
import 'dart:convert' as convert;

class UserLocation extends StatefulWidget {


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



class _UserLocationState extends State<UserLocation> {

  bool isLoading;

  @override
    void initState() {
      isLoading = true;
      getData();
      super.initState();
    }
  @override
  Widget build(BuildContext context) {
    return makeBody(

    );
  }


  Widget indicator(){
    return Scaffold(

        backgroundColor: Colors.red,

    );
  }

  Widget showData(){
    return Scaffold(

        backgroundColor: Colors.green,

    );
  }

  Widget makeBody(){
      if(isLoading){
        return this.indicator();
      }else{
        return this.showData();
      }
  }

  Future getData() async{

      var response = await http.get(Uri.encodeFull('http://xxxx'));
      if(response.statusCode == 200){

            setState(() {
              isLoading = false;
              var jsonResponse = convert.jsonDecode(response.body);
              var data = jsonResponse['data'] as List;
             print(data);
            });


      }else{
        setState(() {
            isLoading = false;
         });


        print("Request failed with status: ${response.statusCode}.");
      }

    }
}

加载数据时，Flutter更改正文小部件

1 个答案: