Flutter
Parse SDK (REST)
คู่มือการจัดการ Parse Objects บน Back4App ด้วย Flutter
10 นาที
คู่มือนี้แสดงวิธีการจัดการ parse objects บน back4app โดยใช้ปลั๊กอิน flutter สำหรับ parse server คุณจะได้เรียนรู้การดำเนินการ crud พื้นฐาน สร้าง, อ่าน, อัปเดต, และลบ บทเรียนนี้ใช้แอป todo ง่ายๆ เพื่อแสดงให้เห็นถึงการดำเนินการเหล่านี้ การจัดเก็บข้อมูล backend ของ back4app หมุนรอบ parseobject , ซึ่งเก็บคู่คีย์ ค่า ของข้อมูลที่เข้ากันได้กับ json การจัดเก็บข้อมูลของ back4app รองรับประเภทข้อมูลทั่วไปที่หลากหลาย รวมถึงสตริง, ตัวเลข, บูลีน, datetime, geopoints, pointers, relations, รวมถึงรายการและวัตถุ โดยพื้นฐานแล้ว มันรองรับข้อมูลใดๆ ที่สามารถเข้ารหัสในรูปแบบ json ได้ ซึ่งให้โซลูชันที่ยืดหยุ่นและแข็งแกร่งสำหรับความต้องการในการจัดเก็บข้อมูลที่หลากหลาย ข้อกำหนดเบื้องต้น ในการทำบทเรียนนี้ให้เสร็จสิ้น คุณจะต้องมี flutter เวอร์ชัน 3 x x หรือใหม่กว่า https //developer android com/studio หรือ https //code visualstudio com/ (พร้อมกับ https //docs flutter dev/get started/editor dart และ flutter) แอป https //www back4app com/docs/get started/new parse app บน back4app หมายเหตุ ติดตาม https //www back4app com/docs/get started/new parse app เพื่อเรียนรู้วิธีการสร้าง parse app บน back4app แอป flutter ที่เชื่อมต่อกับ back4app หมายเหตุ ติดตาม https //www back4app com/docs/flutter/parse sdk/parse flutter sdk เพื่อสร้างโปรเจกต์ flutter ที่เชื่อมต่อกับ back4app อุปกรณ์ (หรืออุปกรณ์เสมือน) ที่รัน 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(); } โค้ดตัวอย่างทั้งหมด นี่คือรหัสทั้งหมดสำหรับแอป todo ง่ายๆ ที่รวมเข้ากับ back4app backend 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 } } } แอปของคุณควรมีลักษณะเช่นนี้ บทสรุป คุณได้ดำเนินการใช้งานฟังก์ชัน crud พื้นฐานในแอป flutter โดยใช้ parse บน back4app แล้ว บทเรียนนี้แสดงให้เห็นถึงวิธีการเพิ่ม, ดึงข้อมูล, อัปเดต, และลบงานในแอป todo