有条件的小部件在扑朔迷离后无效或变化

Question

我只是在编写一个简单的应用程序。我遇到了需要有条件地显示小部件的情况。我正在使用Google表的应用程序脚本API获取数据。我想在加载过程中显示“加载...”文本，并希望在完成请求后将其隐藏。

以下代码工作，如果我在/使用Android Studio 内运行它。但是，如果我构建APK并将其安装在设备上，则仅在屏幕上显示“加载...”文本，尽管数据已加载并存储在listresponse中。

class HomePage extends StatefulWidget {
  const HomePage({Key? key, required this.title, required this.baseUrl}) : super(key: key);
  final String title;
  final String baseUrl;

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  late List listResponse = [];

  Future categories() async {
    var url = widget.baseUrl + 'categories';
    http.Response response = await http.get(Uri.parse(url));
    if(response.statusCode == 200){
      setState(() {
        listResponse = json.decode(response.body);
        print(listResponse.toString());
      });
    }
  }

  @override
  void initState(){
    categories();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: TopBar(title: widget.title),
      body: listResponse.isEmpty ? Center(child: Text('Loading...')) :  Center(child: Text(listResponse.toString()))
    );
  }
}

我搜索了该解决方案，并在Stackoverflow上找到了一些示例。随着应用程序在开发中的预期运行时，可能是问题。感谢您的帮助。

Answer 1

您可以使用条件值显示加载并结果，以bool issuccess = false以及在statuscode == 200 SetState中，使其issuccess = true

class _HomePageState extends State<HomePage> {
  late List listResponse = [];
  bool isSuccess = false;

  Future categories() async {
    var url = widget.baseUrl + 'categories';
    http.Response response = await http.get(Uri.parse(url));
    if(response.statusCode == 200){
      setState(() {
        listResponse = json.decode(response.body);
        isSuccess = true;
        print(listResponse.toString());

      });
    }
  }

  @override
  void initState(){
    categories();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: TopBar(title: widget.title),
      body: isSuccess  ? Center(child: Text('Loading...')) :  Center(child: Text(listResponse.toString()))
    );
  }

获取数据时，它将正常工作。
或者，您也可以使用futureBiulder

  @override
  Widget build(BuildContext context) {
    return FutureBuilder(
        future: categories(),
        builder: (context, snapshot) {
          if (snapshot.hasError) {
            return Text(
              'There was an error :(',
              style: Theme.of(context).textTheme.headline,
            );
          } else if (snapshot.hasData) {
            var count = json.decode(snapshot.data).length;
            return Center(child: Text(listResponse.toString()));
          } else {
            return Center(child: Text('Loading...')) 
          }
        });
  }