Question

我试图将这些数据的输出显示在列表中，但不能显示

这是我的数据输出

{activity: {"project":" Distributions","code":2000,"code_name":"OpenProcessSnapshot","activity":{"id_process_snapshot":988,"name":"Android Process"}}, created_at: 2019-06-20 08:58:48.492885+07, id: 1, id_user: 1}
{activity: {"project":"Distributions","code":2000,"code_name":"OpenProcessSnapshot","activity":{"id_process_snapshot":988,"name":"Android Process"}}, created_at: 2019-06-20 08:58:48.492885+07, id: 1, id_user: 1}
{activity: {"project":" Distributions","code":2000,"code_name":"OpenProcessSnapshot","activity":{"id_process_snapshot":988,"name":"Android Process"}}, created_at: 2019-06-20 08:58:48.492885+07, id: 1, id_user: 1}

这是我的代码

FutureBuilder(
                future: UserController.getActivity(_selectedUser),
                builder: (context, snapshot) {
                  if (snapshot.hasData) {
                    print(snapshot.data.toString());
                    return Column(
                      mainAxisSize: MainAxisSize.min,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: <Widget>[
                        Text(snapshot.data.toString()),
                      ],
                    );
                  } else {
                    return Center(
                      child: Text("No data displayed"),
                    );
                  }

                  return Center(
                    child: CircularProgressIndicator(),
                  );
                },
              ),

如果我要显示created_at和项目怎么办？

Answer 1

您可以使用jsonDecode获取该特定元素。

Documentation Link

对于您的情况，您必须创建一个新的小部件函数并将其返回：

//put this method before your widget build function
Widget _mapJsonDataToText(String data){
  Map<String, List<dynamic>> jsonData = jsonDecode(data);

  Map<String, dynamic> jsonDataInner = jsonDecode(jsonData['activity']);
  return Text(jsonDataInner['created_at']);
  //do the same for project 
}

children: <Widget>[
   //gets the method that returns the text widget
   _mapJsonDataToText(snapshot.data.toString()),
],

Answer 2

我有另一种方法，这会将数据加到列表中。不使用Future Builder，只是利用我的常识将数据逻辑地显示在列表中。

假设您了解http的抖动，如果您不了解，那么这是您的链接：Fetch data from the internet

假设您有一个data[]，其中activity{}会显示在JSON输出中。

List<String> project = [];
List<String> createdAt = [];

void initState(){
 super.initState();
 //this will run this method on call of this page, everytime
 this.fetchData();
}

Future<void> fetchData() async{
  List<String> _project = [];
  List<String> _createdAt = [];

  final response =
      await http.get('your_api_url');
  //looping through the array of activity object
  (response['data'] as list).forEach((item){
      //check if the data comes correct
      print(item['activity']['project']);
      print(item['created_at']);
     _project.add(item['activity']['project']);
     _createdAt.add(item['created_at']);
  });

  setState((){
    this.project = _project;
    this.createdAt = _createdAt;
  });
}

//In order to show them in the list of project, call ListView()
List<Widget> projectWidget(){
  List<Widget> _widget = [];

  this.project.forEach((item){
    _widget.add(item);
  });

  return _widget;
}

//In order to show them in the list of createdAt, call ListView()
List<Widget> createdAtWidget(){
  List<Widget> _anotherWidget = [];

  this.createdAt.forEach((item){
    _anotherWidget.add(item);
  });

  return _anotherWidget;
}

根据需要在用户界面中显示数据。如果适合您，请让我。谢谢：）

转换数组以显示在列表中

2 个答案: