Flutter
Parse SDK (REST)
CRUD-Operationen mit Parse SDK in Flutter App
10 min
dieser leitfaden zeigt, wie man parse objekte auf back4app mit dem flutter plugin für parse server verwaltet sie lernen die grundlegenden crud operationen erstellen, lesen, aktualisieren und löschen dieses tutorial verwendet eine einfache todo app, um diese operationen zu veranschaulichen die backend datenspeicherung von back4app dreht sich um den parseobject , der schlüssel wert paare von json kompatiblen daten enthält die datenspeicherung von back4app unterstützt eine vielzahl gängiger datentypen, einschließlich strings, zahlen, booleans, datetime, geopoints, pointers, relations sowie listen und objekte im wesentlichen unterstützt es alle daten, die im json format codiert werden können, und bietet eine flexible und robuste lösung für verschiedene datenspeicheranforderungen voraussetzungen um dieses tutorial abzuschließen, benötigen sie flutter version 3 x x oder höher android studio https //developer android com/studio oder vs code installiert (mit plugins dart und flutter) eine app erstellt auf back4app hinweis folgen sie dem neuen parse app tutorial um zu lernen, wie man eine parse app auf back4app erstellt eine flutter app, die mit back4app verbunden ist hinweis folgen sie dem installieren sie das parse sdk im flutter projekt um ein flutter projekt zu erstellen, das mit back4app verbunden ist ein gerät (oder virtuelles gerät), das android oder ios ausführt 1\ objekt erstellen die savetodo funktion erstellt eine neue aufgabe mit einem titel und einem done status, der auf falsch gesetzt ist so funktioniert es initialisiere das parse objekt und setze seine attribute erstelle eine instanz von parseobject für deine klasse (z b 'todo') verwende die set methode, um die schlüssel wert paare zu definieren speichere das objekt rufe die save methode auf, um das objekt in der datenbank zu speichern future\<void> savetodo(string title) async { final todo = parseobject('todo') set('title', title) set('done', false); await todo save(); } 2\ objekt lesen die gettodo funktion fragt die datenbank ab und gibt eine liste von aufgaben zurück so funktioniert es die abfrage initialisieren erstellen sie eine instanz von querybuilder für ihre klasse die abfrage ausführen verwenden sie die query methode, um daten abzurufen die antwort verarbeiten überprüfen sie, ob die abfrage erfolgreich war, und verarbeiten sie die ergebnisse 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 \[]; } } aktualisieren sie die listview\ builder funktion, um die werte des parse objekts zu extrahieren und anzuzeigen // get parse object values final vartodo = snapshot data!\[index]; final vartitle = vartodo get\<string>('title')!; final vardone = vartodo get\<bool>('done')!; 3\ objekt aktualisieren die updatetodo funktion aktualisiert den status einer bestehenden aufgabe so funktioniert es initialisieren sie das parse objekt und setzen sie attribute erstellen sie eine instanz von parseobject und setzen sie dessen objectid verwenden sie die set methode, um schlüssel wert paare zu aktualisieren speichern sie das objekt rufen sie die save methode auf, um das objekt in der datenbank zu aktualisieren future\<void> updatetodo(string id, bool done) async { var todo = parseobject('todo') objectid = id set('done', done); await todo save(); } 4\ objekt löschen die deletetodo funktion entfernt eine bestehende aufgabe aus der datenbank so funktioniert es initialisieren sie das parse objekt erstellen sie eine instanz von parseobject und setzen sie dessen objectid löschen sie das objekt rufen sie die delete methode auf, um das objekt aus der datenbank zu entfernen future\<void> deletetodo(string id) async { var todo = parseobject('todo') objectid = id; await todo delete(); } vollständiger beispielcode hier ist der vollständige code für eine einfache todo app, die mit dem back4app backend integriert ist 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 } } } ihre app sollte so aussehen fazit sie haben nun die grundlegenden crud operationen in einer flutter app mit parse auf back4app implementiert dieses tutorial hat gezeigt, wie man aufgaben in einer todo app hinzufügt, abruft, aktualisiert und löscht