You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Flutter开发中如何从MySQL数据库获取最后插入的一条记录

实现方案整体逻辑

Flutter端无法直接远程连接MySQL数据库,需要先通过后端服务提供数据查询接口,整体实现分为3个核心环节:后端接口开发、Flutter端请求接口获取数据、跨页面传值并展示数据。

步骤1:后端接口开发

你可以用任意熟悉的后端技术栈(Node.js/Java/Python/Go等)开发接口,核心逻辑如下:

  • 编写MySQL查询语句,按自增主键或者数据创建时间倒序排序后取第一条即可拿到最新存入的单条数据,示例SQL:
    SELECT * FROM 你的业务表名 ORDER BY 主键id/created_at字段 DESC LIMIT 1;
    
  • 接口设计为GET请求,返回标准JSON格式,示例返回结构:
    {
      "code": 200,
      "msg": "查询成功",
      "data": {
        "id": 207,
        "content": "最新存入的业务内容",
        "created_at": "2024-05-22 14:30:15"
      }
    }
    
步骤2:Flutter端请求接口获取数据

首先在pubspec.yaml中添加网络请求依赖:

dependencies:
  flutter:
    sdk: flutter
  http: ^1.2.1 # 新增http依赖

执行flutter pub get安装依赖后,先编写数据实体类做类型校验:

class LatestData {
  final int id;
  final String content;
  final String createdAt;

  LatestData({
    required this.id,
    required this.content,
    required this.createdAt
  });

  factory LatestData.fromJson(Map<String, dynamic> json) {
    return LatestData(
      id: json['id'],
      content: json['content'],
      createdAt: json['created_at'],
    );
  }
}

再编写数据请求方法:

import 'package:http/http.dart' as http;
import 'dart:convert';

Future<LatestData> fetchLatestData() async {
  final response = await http.get(Uri.parse('替换为你自己的后端接口地址'));
  if (response.statusCode == 200) {
    final resData = json.decode(response.body);
    return LatestData.fromJson(resData['data']);
  } else {
    throw Exception('数据请求失败');
  }
}
步骤3:跳转页面并展示数据

首先在当前页面的触发逻辑中,先请求数据再跳转下一页同时传值:

// 比如按钮点击事件的逻辑
onPressed: () async {
  // 展示加载提示
  showDialog(
    context: context,
    builder: (context) => const Center(child: CircularProgressIndicator()),
    barrierDismissible: false
  );
  try {
    LatestData data = await fetchLatestData();
    // 关闭加载框
    if(context.mounted) Navigator.pop(context);
    // 跳转下一页
    if(context.mounted) {
      Navigator.push(
        context,
        MaterialPageRoute(
          builder: (context) => NextPage(latestData: data),
        ),
      );
    }
  } catch(e) {
    // 异常处理:关闭加载框+提示错误
    if(context.mounted) {
      Navigator.pop(context);
      ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text(e.toString())));
    }
  }
},

编写接收数据的下一个页面NextPage:

class NextPage extends StatelessWidget {
  final LatestData latestData;
  const NextPage({super.key, required this.latestData});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('最新数据展示')),
      body: Padding(
        padding: const EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text('数据ID:${latestData.id}'),
            const SizedBox(height: 12),
            Text('数据内容:${latestData.content}'),
            const SizedBox(height: 12),
            Text('存入时间:${latestData.createdAt}'),
          ],
        ),
      ),
    );
  }
}
注意事项
  • 移动端开发需要在Android和iOS的配置文件中添加网络权限,避免请求被拦截
  • Web端开发需要后端接口配置跨域规则,否则会出现跨域报错
  • 生产环境建议给接口添加签名校验,避免数据被恶意爬取

内容的提问来源于stack exchange,提问作者Anugrah c.p

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.07 12:48:03