flutter - 如何根据输入的 TextField 值显示 MySQL 查询结果

Question

我是 Flutter 的新手，想了解如何根据用户输入的 TextField 值显示 MySQL 查询结果。

因为我是 Flutter 的新手，所以我从其他教程中收集了一些零碎的东西来尝试取得成果。

一些帮助将不胜感激，因为我已经为此苦苦挣扎了数周。这是对我的问题的重新编辑，因为我试图更具描述性，希望有人能提供帮助。谢谢

这是我的 MySQL 表：

这是我的 PHP 文件 (flutter_data.PHP)

$con = mysqli_connect($HostName, $HostUser, $HostPass, $DatabaseName);

$json = file_get_contents('php://input'); 

$obj = json_decode($json,true);

$name = $obj['name'];//this value coming from TextField ( i hope :-)) 

$CheckSQL = "SELECT * FROM Student_data WHERE student_name = '$name'";

$result = $con->query($CheckSQL);

if ($result->num_rows >0) {

 while($row[] = $result->fetch_assoc()) {

 $Item = $row;

 $json = json_encode($Item, JSON_NUMERIC_CHECK);

 }

}else {

 echo "No Results Found.";

}

echo $json;

$con->close();
?>

我做了一个测试，看看我的 PHP 文件在没有 WHERE 子句的情况下是否可以工作。下面运行我的 PHP 文件。

我的主屏幕由 TextField 、 Image 、 FlatButton 组成

设置类变量：

 int studentID;
 String studentName;
 int studentPhoneNumber;
 String studentSubject;

  Studentdata({
    this.studentID,
    this.studentName,
    this.studentPhoneNumber,
    this.studentSubject
  });

  factory Studentdata.fromJson(Map<String, dynamic> json) {
    return Studentdata(
      studentID: json['id'],
      studentName: json['student_name'],
      studentPhoneNumber: json['student_phone_number'],
      studentSubject: json['student_class']

    );
  }
}

我已将我的 TextField 设置为捕获 onChanged 值

 onChanged: (value) {

                setState(() {

                    name = value;

我的 FlatButton 与 onPressed ：

onPressed: () {


                  var route = new MaterialPageRoute(

                    builder: (BuildContext context) => new NextPageState(name.toString(),                           


                  ));
                  Navigator.of(context).push(route);
                },

NextPage 的以下代码：

class NextPageState extends StatefulWidget {

  final String name;

  NextPageState(this.name);

  @override

  State<StatefulWidget> createState() {

    return NextPage(this.name);

  }
}

class NextPage extends State<NextPageState> {

  final String name ;

  NextPage(this.name);

  // API URL
  var url = 'https://www.datashine.co.za/flutter_data.php';

  Future<List<Studentdata>> fetchStudent() async {

    var data = {'name': name};

    var response = await http.post(url, body: json.encode(data));

    if (response.statusCode == 200) {

      print(response.statusCode);

      final items = json.decode(response.body).cast<Map<String, dynamic>>();

      List<Studentdata> studentList = items.map<Studentdata>((json) {
        return Studentdata.fromJson(json);
      }).toList();

      return studentList;

      }

    else {
      throw Exception('Failed to load data from Server.');
    }
  }

  @override
Widget build(BuildContext context) {
  return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text(name),
          automaticallyImplyLeading: true,
          leading: IconButton(icon:Icon(Icons.arrow_back),
          onPressed:() => Navigator.pop(context, false),
        )
      ),
      body: FutureBuilder<List<Studentdata>>(
      future: fetchStudent(),
      builder: (context, snapshot) {

      if (!snapshot.hasData) return Center(
        child: CircularProgressIndicator()
      );

        return ListView(
      children: snapshot.data
      .map((data) => Column(children: <Widget>[

        GestureDetector(
          onTap: (){print(data.studentName);},
          child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [

          Padding(
          padding: EdgeInsets.fromLTRB(0, 20, 0, 10),
          child: Text('Name = ' + data.studentName.toString(),
            style: TextStyle(fontSize: 21))),



                  ]),)
                 ],))
           .toList(),
              );
             },
            )
          ));
         }
        }

运行 App 后，似乎没有返回任何结果。所以我不知道如何修复 . Circularprogress 指示器只是加载并挂起。