Flutter与Back4app集成进行Parse对象CRUD操作指南

本指南演示了如何使用 flutter 插件在 back4app 上管理 parse 对象。您将学习基本的 crud 操作：创建、读取、更新和删除。本教程使用一个简单的待办事项应用程序来说明这些操作。 back4app 后端数据存储围绕着 parseobject , 它保存 json 兼容数据的键值对。back4app 数据存储支持广泛的常见数据类型，包括字符串、数字、布尔值、日期时间、地理点、指针、关系，以及列表和对象。基本上，它支持任何可以编码为 json 格式的数据，为各种数据存储需求提供灵活而强大的解决方案。 先决条件 要完成本教程，您需要： flutter 版本 3 x x 或更高版本 android studio https //developer android com/studio 或 已安装的 vs code （带有 插件 dart 和 flutter） 一个应用 创建 在 back4app 上 注意 请遵循 新解析应用教程 以了解如何在 back4app 上创建解析应用 一个连接到 back4app 的 flutter 应用 注意 请遵循 在 flutter 项目中安装解析 sdk 以创建一个连接到 back4app 的 flutter 项目 一台运行 android 或 ios 的设备（或虚拟设备）。 1\ 创建对象 这个 savetodo 函数创建一个新的任务，带有标题和一个 done 状态设置为 false。它的工作原理如下： 初始化 parse 对象并设置其属性 创建一个 parseobject 的实例用于你的类（例如，'todo'）。使用 set 方法来定义键值对。 保存对象 调用 save 方法将对象存储在数据库中。 future\<void> savetodo(string title) async { final todo = parseobject('todo') set('title', title) set('done', false); await todo save(); } 2\ 读取对象 这个 gettodo 函数查询数据库并返回任务列表。它的工作原理如下： 初始化查询 为你的类创建一个 querybuilder 的实例。 执行查询 使用 query 方法来检索数据。 处理响应 检查查询是否成功并处理结果。 future\<list\<parseobject>> gettodo() async { querybuilder\<parseobject> querytodo = querybuilder\<parseobject>(parseobject('todo')); final parseresponse apiresponse = await querytodo query(); if (apiresponse success && apiresponse results != null) { return apiresponse results as list\<parseobject>; } else { return \[]; } } 更新 listview\ builder 函数以提取和显示 parse 对象值： // get parse object values final vartodo = snapshot data!\[index]; final vartitle = vartodo get\<string>('title')!; final vardone = vartodo get\<bool>('done')!; 3\ 更新对象 该 updatetodo 函数更新现有任务的状态。以下是它的工作原理： 初始化 parse 对象并设置属性 创建一个 parseobject 的实例并设置其 objectid 使用 set 方法更新键值对。 保存对象 调用 save 方法将对象更新到数据库中。 future\<void> updatetodo(string id, bool done) async { var todo = parseobject('todo') objectid = id set('done', done); await todo save(); } 4\ 删除对象 该 deletetodo 函数从数据库中删除现有任务。以下是它的工作原理： 初始化 parse 对象 创建一个 parseobject 的实例并设置其 objectid 删除对象 调用 delete 方法从数据库中移除对象。 future\<void> deletetodo(string id) async { var todo = parseobject('todo') objectid = id; await todo delete(); } 完整示例代码 这是一个与back4app后端集成的简单待办事项应用的完整代码。 import 'package\ flutter/material dart'; import 'package\ parse server sdk flutter/parse server sdk flutter dart'; void main() async { widgetsflutterbinding ensureinitialized(); const keyapplicationid = 'your app id here'; const keyclientkey = 'your client key here'; const keyparseserverurl = 'https //parseapi back4app com'; await parse() initialize(keyapplicationid, keyparseserverurl, clientkey keyclientkey, autosendsessionid true); runapp(const materialapp(home todoapp())); } class todoapp extends statefulwidget { const todoapp({super key}); @override // ignore library private types in public api todoappstate createstate() => todoappstate(); } class todoappstate extends state\<todoapp> { list\<parseobject> tasks = \[]; texteditingcontroller taskcontroller = texteditingcontroller(); @override void initstate() { super initstate(); gettodo(); } @override widget build(buildcontext context) { return materialapp( debugshowcheckedmodebanner false, theme themedata( primarycolor colors white, hintcolor colors black, scaffoldbackgroundcolor colors white, appbartheme appbartheme(backgroundcolor color fromargb(255, 68, 122, 246))), home scaffold( appbar appbar( title const text('todo list'), ), body container( decoration boxdecoration( border border all(color colors black), ), child column( children \[ const sizedbox(height 20), buildtaskinput(), const sizedbox(height 20), expanded(child buildtasklist()), ], ), ), ), ); } widget buildtaskinput() { return padding( padding const edgeinsets symmetric(horizontal 20), child row( children \[ expanded( child textfield( controller taskcontroller, decoration inputdecoration( hinttext 'enter tasks', filled true, fillcolor colors grey\[200], border outlineinputborder( borderradius borderradius circular(8), borderside borderside none, ), ), ), ), const sizedbox(width 10), elevatedbutton( onpressed addtodo, style buttonstyle( foregroundcolor materialstateproperty all\<color>(colors black)), child const text('add'), ), ], ), ); } widget buildtasklist() { return listview\ builder( itemcount tasks length, itembuilder (context, index) { final vartodo = tasks\[index]; final vartitle = vartodo get\<string>('title') ?? ''; bool done = vartodo get\<bool>('done') ?? false; return listtile( title row( children \[ checkbox( value done, onchanged (newvalue) { updatetodo(index, newvalue!); }, ), expanded(child text(vartitle)), ], ), trailing iconbutton( icon const icon(icons delete), onpressed () { deletetodo(index, vartodo objectid!); }, ), ); }, ); } future\<void> addtodo() async { string task = taskcontroller text trim(); if (task isnotempty) { var todo = parseobject('todo') set('title', task) set('done', false); var response = await todo save(); if (response success) { setstate(() { tasks add(todo); }); taskcontroller clear(); } else { // handle error } } } future\<void> updatetodo(int index, bool done) async { final vartodo = tasks\[index]; final string id = vartodo objectid tostring(); var todo = parseobject('todo') objectid = id set('done', done); var response = await todo save(); if (response success) { setstate(() { tasks\[index] = todo; }); } else { // handle error } } future\<void> gettodo() async { var querybuilder = querybuilder\<parseobject>(parseobject('todo')); var apiresponse = await querybuilder query(); if (apiresponse success && apiresponse results != null) { setstate(() { tasks = apiresponse results as list\<parseobject>; }); } else { // handle error } } future\<void> deletetodo(int index, string id) async { var todo = parseobject('todo') objectid = id; var response = await todo delete(); if (response success) { setstate(() { tasks removeat(index); }); } else { // handle error } } } 您的应用程序应该看起来像这样 结论 您现在已经在使用 back4app 的 flutter 应用中实现了基本的 crud 操作。本教程演示了如何在 todo 应用中添加、检索、更新和删除任务。