Flutter 从json获取数据并将其放入文本字段中

亲爱的

我是Dart and Flatter的新开发者。。也适用于移动应用程序

我所做的是从NFC数据中获取数据（如下所示的加密数据）

“$2y$10$Mo.IV5MEPQFYDZPFHTR.y8HWNlOndhV4gIY//X18XHP1ARCPTI”

)然后我通过API发送加密数据，以获得学生的信息，如下面的JSON

[{"id":1,"STUDENT_ID":1,"COURSE":"GOL","HASH":"$2y$10$Mo.iv5mePQFyDezZpFhtR.y8HWNlOndhV4gIY\/\/x18XhP1OarCpti","created_at":"2019-09-11 12:24:03","FNAME":"Mohammad","MNAME":"Ahmad","LNAME":"KASSAB","STATE":"Nabatyeh","CITY":"Kafarchuba","NUMBER":82381,"QRCODE":"123456789"}]

在我的小部件中，每个字段都有一个文本字段（FNAME，LNAME…），我需要在文本字段中插入JSON数据

请问怎么做

这是我班的学生

class Student {
  String fname;
  String mname;
  String lname;
  String number;
  String course;

  Student(
      {this.fname,
      this.mname,
      this.lname,
      this.number,
      this.course
      });

  factory Student.fromJson(json) {
    return Student(
        fname: json["FNAME"],
        mname: json["MNAME"],
        lname: json["LNAME"],
        number: json["NUMBER"],
        course: json["COURSE"]);
  }
}

主飞镖

import 'dart:async';
import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:flutter_nfc_reader/flutter_nfc_reader.dart';
import 'package:http/http.dart' as http;
import './student.dart' ;

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Read NFC',
      home: new MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  final Map<String, dynamic> pluginParameters = {};

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

class _MyHomePageState extends State<MyHomePage> {
  String s = '';
  var fname = TextEditingController();
  var lname = TextEditingController();
  var mname = TextEditingController();
  var number = TextEditingController();
  var course = TextEditingController();
  List ss = [];
  Future<List> jso;

  Future<List<Student>> getData(String hash) async {
    List<Student> list;
    var response = await http.get(
      Uri.encodeFull("http://209.97.178.237/NFC/public/getHash?hash="+hash),
      headers: {
        "Accept": "application/json"
      }
    );
    if (response.statusCode == 200) {
        var data = json.decode(response.body);
        var rest = data as List;
        print(rest);
        list = rest.map<Student>((json) => Student.fromJson(json)).toList();
      }
       return list;
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: const Text('NFC READER'),
      ),
      body: Container(
        margin: EdgeInsets.all(50),
        width: double.infinity,
        child: Column(
          children: <Widget>[
            new Container(
              margin: const EdgeInsets.fromLTRB(10, 10, 10, 40),
              child: new RaisedButton(
                child: Text("Read NFC"),
                onPressed: () {
                  FlutterNfcReader.read().then((response) {
                    setState(() {
                      print(response.content);
                      //response.content is the NFC result;
                     // here what to do ? 
                    });
                  });
                },
                color: Colors.red,
                textColor: Colors.white,
                padding: EdgeInsets.fromLTRB(10, 10, 10, 10),
                splashColor: Colors.grey,
              ),
            ),
            new Text(
              s,
            ),
            Padding(
              padding: EdgeInsets.only(top: 0, bottom: 25.0, left: 0, right: 0),
              child: TextFormField(
                decoration: InputDecoration(
                  labelText: 'First Name',
                  fillColor: Colors.white,
                  border: new OutlineInputBorder(
                    borderRadius: new BorderRadius.circular(15.0),
                  ),
                ),
                readOnly: true,
                controller: fname,
              ),
            ),
            Padding(
              padding: EdgeInsets.only(top: 0, bottom: 25.0, left: 0, right: 0),
              child: TextFormField(
                decoration: InputDecoration(
                  labelText: 'Middle Name',
                  fillColor: Colors.white,
                  border: new OutlineInputBorder(
                    borderRadius: new BorderRadius.circular(15.0),
                  ),
                ),
                readOnly: true,
                controller: fname,
              ),
            ),
            Padding(
              padding: EdgeInsets.only(top: 0, bottom: 25.0, left: 0, right: 0),
              child: TextFormField(
                decoration: InputDecoration(
                  labelText: 'Last Name',
                  fillColor: Colors.white,
                  border: new OutlineInputBorder(
                    borderRadius: new BorderRadius.circular(15.0),
                  ),
                ),
                readOnly: true,
                controller: fname,
              ),
            ),
            Padding(
              padding: EdgeInsets.only(top: 0, bottom: 25.0, left: 0, right: 0),
              child: TextFormField(
                decoration: InputDecoration(
                  labelText: 'Number',
                  fillColor: Colors.white,
                  border: new OutlineInputBorder(
                    borderRadius: new BorderRadius.circular(15.0),
                  ),
                ),
                readOnly: true,
                controller: fname,
              ),
            ),
            Padding(
              padding: EdgeInsets.only(top: 0, bottom: 25.0, left: 0, right: 0),
              child: TextFormField(
                decoration: InputDecoration(
                  labelText: 'Course',
                  fillColor: Colors.white,
                  border: new OutlineInputBorder(
                    borderRadius: new BorderRadius.circular(15.0),
                  ),
                ),
                readOnly: true,
                controller: fname,
              ),
            ),
          ],
        ),
      ),
    );
  }
}

导入'dart:async'；
导入“dart:convert”；
进口“包装：颤振/材料.省道”；
导入“package:flatter\u nfc\u reader/flatter\u nfc\u reader.dart”；
将“package:http/http.dart”导入为http；
导入“/student.dart”；
void main（）{
runApp（新的MyApp（））；
}
类MyApp扩展了无状态小部件{
@凌驾
小部件构建（构建上下文）{
返回新材料PP(
标题：“阅读NFC”，
主页：新建MyHomePage（），
);
}
}
类MyHomePage扩展StatefulWidget{
MyHomePage（{Key，this.title}）：超级（Key:Key）；
最后的字符串标题；
最终映射插件参数={}；
@凌驾
_MyHomePageState createState（）=>\u MyHomePageState（）；
}
类_MyHomePageState扩展状态{
字符串s=''；
var fname=TextEditingController（）；
var lname=TextEditingController（）；
var mname=TextEditingController（）；
var number=TextEditingController（）；
var course=TextEditingController（）；
列表ss=[]；
未来jso；
未来getData（字符串哈希）异步{
名单；
var response=wait http.get(
Uri.encodeFull（“http://209.97.178.237/NFC/public/getHash?hash=“+散列），
标题：{
“接受”：“应用程序/json”
}
);
如果（response.statusCode==200）{
var data=json.decode（response.body）；
var rest=数据作为列表；
打印（其余）；
list=rest.map（（json）=>Student.fromJson（json））.toList（）；
}
退货清单；
}
@凌驾
小部件构建（构建上下文）{
归还新脚手架(
appBar：新的appBar(
标题：常量文本（“NFC阅读器”），
),
主体：容器(
保证金：全部（50），
宽度：double.infinity，
子：列(
儿童：[
新容器(
边距：LTRB（10,10,10,40）的常数边集，
孩子：新升起的按钮(
子项：文本（“读取NFC”），
已按下：（）{
flatternfcreader.read（）.then（（响应）{
设置状态（）{
打印（响应.内容）；
//response.content是NFC结果；
//这里怎么办？
});
});
},
颜色：颜色，红色，
textColor:Colors.white，
填充：从LTRB（10,10,10,10）开始的边缘设置，
颜色：颜色。灰色，
),
),
新文本(
s
),
填充物(
填充：仅限边集（顶部：0，底部：25.0，左侧：0，右侧：0），
子项：TextFormField(
装饰：输入装饰(
labelText:“名字”，
fillColor:Colors.white，
边框：新大纲输入边框(
边界半径：新边界半径。圆形（15.0），
),
),
只读：对，
控制员:fname,，
),
),
填充物(
填充：仅限边集（顶部：0，底部：25.0，左侧：0，右侧：0），
子项：TextFormField(
装饰：输入装饰(
labelText:“中间名”，
fillColor:Colors.white，
边框：新大纲输入边框(
边界半径：新边界半径。圆形（15.0），
),
),
只读：对，
控制员:fname,，
),
),
填充物(
填充：仅限边集（顶部：0，底部：25.0，左侧：0，右侧：0），
子项：TextFormField(
装饰：输入装饰(
labelText:“姓氏”，
fillColor:Colors.white，
边框：新大纲输入边框(
边界半径：新边界半径。圆形（15.0），
),
),
只读：对，
控制员:fname,，
),
),
填充物(
填充：仅限边集（顶部：0，底部：25.0，左侧：0，右侧：0），
子项：TextFormField(
装饰：输入装饰(
labelText:'编号'，
fillColor:Colors.white，
边框：新大纲输入边框(
边界半径：新边界半径。圆形（15.0），
),
),
只读：对，
控制员:fname,，
),
),
填充物(
填充：仅限边集（顶部：0，底部：25.0，左侧：0，右侧：0），
子项：TextFormField(
装饰：输入装饰(
labelText:“课程”，
fillColor:Colors.white，
边框：新大纲输入边框(
边界半径：新边界半径。圆形（15.0），
),
),
只读：对，
控制员:fname,，
),
),
],
),
),
);
}
}

---

谢谢。

您可以为控制器提供Student对象的每个属性，如下所示

FlutterNfcReader.read().then((response) {
  // create your Student object here with the data received from the api
  Student student = ...
  setState(() {
    // supply the controllers with the data of the student object
    fname.text = student.fname;
    ...
  });
});

之后，使用控制器填充TextFormField

Padding(
  padding: EdgeInsets.only(top: 0, bottom: 25.0, left: 0, right: 0),
  child: TextFormField(
    // here is where you fill the TextFormField
    controller: fname,
    decoration: InputDecoration(
      labelText: 'First Name',
      fillColor: Colors.white,
      border: new OutlineInputBorder(
        borderRadius: new BorderRadius.circular(15.0),
      ),
    ),
    readOnly: true,
  ),
),