Question

我正在尝试将数据库中的数据显示给Flutter。我能够获取数据，但不知道如何在Flutter中显示数据。我可以显示单个数据，但是很难显示多个数据。

我正在将DIO插件用于HTTP请求。

这是代码。

Future getData() async{

    try{  
      dtguid ='34';            
      var bodyss = { "uid" : dtgUid, "deviceid": deviceid};

      Response<Map> responsess =
          await Dio().post("http://192.168.100.4:8080/sampleapp/get-followingdata.php", data: bodyss,);
         Map responseBody = response.data;
        if(responseBodys['success'] == false){

           _showSnackBar(context,responseBody['errors']['inputuid'],Colors.redAccent);

          this.setState((){
            _inProcess = false;
          });

        }else{
          print(responseBody['success']);
          totalcount = responseBody['count'];
          this.setState((){

            _inProcess = false;
          });

        }

    }catch(e){
       print("Exception Caught: $e");
    }

  }

这是我需要显示此数据的小部件。

Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Text(
               'Test',//  schoolLists[index]['name'],
                  style: TextStyle(
                      color: primary,
                      fontWeight: FontWeight.bold,
                      fontSize: 18),
                ),
                SizedBox(
                  height: 6,
                ),
                Row(
                  children: <Widget>[
                    Icon(
                      Icons.location_on,
                      color: secondary,
                      size: 20,
                    ),
                    SizedBox(
                      width: 5,
                    ),
                    Text(
                      'Earth',//schoolLists[index]['location'],
                        style: TextStyle(
                            color: primary, fontSize: 13, letterSpacing: .3)),
                  ],
                ),
                SizedBox(
                  height: 6,
                ),
                Row(
                  children: <Widget>[
                    Icon(
                      Icons.school,
                      color: secondary,
                      size: 20,
                    ),
                    SizedBox(
                      width: 5,
                    ),
                    Text(
                      'Some Data',
                      //schoolLists[index]['type'],
                        style: TextStyle(
                            color: primary, fontSize: 13, letterSpacing: .3)),
                  ],
                ),
              ],
            ),
          )

出于测试目的，我尝试了一些有效的硬编码数据schoolLists，但我不知道如何显示http请求中的数据。

样本数据。

{"errors":[],
"content":[{"uid":34,"age":35,"name":"Test User 1","country":"India"},
{"uid":34,"age":37,"name":"Test User 2","country":"India"},
{"uid":34,"age":36,"name":"Test User 3","country":"India"}],
"success":true}

我需要向小部件显示名称和国家。代替该测试值。

Text(
               'Test',//  schoolLists[index]['name'],
                  style: TextStyle(
                      color: primary,
                      fontWeight: FontWeight.bold,
                      fontSize: 18),
                ),

稍后，我将尝试处理Lazyload。不幸的是，我无法显示数据，所以没有询问lazyload。

说实话，我正在学习Flutter。我没有太多经验。

Answer 1

我看不到您解码身体响应数据首先导入代码

import 'dart:convert' as convert;

比您的函数getData（）解码服务器JSON响应

//get the json data decode it and store it in decodedResponse
var decodedResponse = convert.jsonDecode(response.body);

比您想要的映射通过解码的响应

Flutter：显示来自RestAPI的数据

1 个答案: