로딩중에서 더이상 변화가 없습니다...

[강설주]

아래와 같이 코드를 작성하였으나 로딩중 화면에서 변화하지 않습니다. 앱을 재작동 시켜도 마찬가지입니다.

아무래도 data가 빈리스트인 상태에서 데이터가 들어와도 반응하지 않는 것으로 보이는데 어떤 조치가 필요할까요?

// import 'dart:ui';
import 'package:flutter/material.dart';
import 'package:instagram/style.dart' as style;
import 'package:http/http.dart' as http;
import 'dart:convert';

void main() {
  runApp(MaterialApp(
    theme: style.theme,
    home: MyApp(),
  ));
}

// var a = TextStyle();

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  var tab = 0;
  var data = [];

  getData() async {
    var result = await http
        .get(Uri.parse('https://codingapple1.github.io/app/data.json'));
    if (result.statusCode == 200) {
      var decoded_result = jsonDecode(result.body);
      // print(decoded_result);
      data = decoded_result;
    } else {
      print('no data connection');
    }
  }

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    getData();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Instagram'),
        actions: [
          IconButton(
            onPressed: () {
              setState(() {});
            },
            icon: Icon(Icons.add_box_outlined),
            iconSize: 30,
          )
        ],
      ),
      body: [Home(data: data), Text('shop')]

,
      bottomNavigationBar: BottomNavigationBar(
        currentIndex: tab,
        showSelectedLabels: false,
        showUnselectedLabels: false,
        onTap: (i) {
          print(i);
          setState(() {
            tab = i;
          });
        },
        items: const [
          BottomNavigationBarItem(
            icon: Icon(
              Icons.home_outlined,
            ),
            label: '홈',
          ),
          BottomNavigationBarItem(
            icon: Icon(
              Icons.shopping_bag_outlined,
            ),
            label: '샵',
          ),
        ],
      ),
    );
  }
}

class Home extends StatelessWidget {
  const Home({Key? key, this.data}) : super(key: key);
  final data;

  @override
  Widget build(BuildContext context) {
    print(data);
    if (data.isNotEmpty) {
      return ListView.builder(
        itemCount: data.length,
        itemBuilder: (c, i) {
          return Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Image.network(data[i]['image']),
              Text(data[i]['content']),
            ],
          );
        },
      );
    } else {
      return Center(child: Text('로딩중'));
    }
  }
}

[강설주]

자문 자답입니다.

getData() async 함수 내부에서 setState를 처리하지 않아서 문제가 되었군요 ㅠㅠ

[글쓴이]

글