Abolfazl mashhadi
Abolfazl mashhadi
خواندن ۵ دقیقه·۲ سال پیش

سریالایز کردن دیتا با استفاده از پکیج json_serializable


سریالاز کردن کردن دیتا های دریافتی از api یکی از کار های متعددی هستش که ما توسعه دهنده های فلاتر بار ها بار ها انجامش دادیم، اما ! این پروسه گاهی خیلی طولانی و اذیت کننده میشه و حتی باعث یکسری اشتباهات میشه . حلا به لطف برنامه نویس های خفن یه پکیج داریم که به کمکش میتونیم فقط فیلد های مدل رو بنویسیم و بقیه کار رو به اتوماسیون و اسکریپت ها بسپاریم تا کار های تکراری و حوصله سر بر برای ما انجام بدن

خوب امروز قرار بریم سراغ یکی از پکیج های معروف این ضمینه به اسم josn_serializable ببیینیم که چجوری با کمک این پکیج میتونیم مدل سازی انجام بدیم

خوب در قدم اول ما باید یکسری پکیج ها رو به پروژمون اضافه کنیم ،

بعد از اضافه کردن پکیج های بالا میریم که مدل که نیاز رو بسازیم ،یه نکته مهم که باید بهش توجه کنید اینکه این پکیج سریالایزر به صورت دیفالت فکر میکنه هر فیلد از کلاس شما داخل جیسونی که قرار بهش بدین قرار داره یعنی چی ؟ بیاین اول یه ریسپانس باهم ببینیم .برای این مقاله من از سایت json place holder استفاده میکنم که بهمون یه ریسپانس خوب بده.

خوب ریسپانس دریافتی ما از این endpoint به این شکل خواد بود . بعد از ساختن فایل مدل در فولدر مدل هامون ما باید شروع کنیم فیلد های مدلمون بسازیم .یه نکته اساسی در مورد این پکیج هست این پکیج میاد هر فیلدی که شما تو کلاس مدل خودتون به هر نحوی اسم گذاریش کردین به عنوان کلید موجود داخل ریسپانسی که بهش پاس میدین میدونه .

چجوری مثلا؟ الان ما داخل ریسپانس دریافتی یک کلید به اسم id داریم درسته؟برای دریافت مقدار اون باید شما یه فیلد داخل کلاستون با اسم id و تایپ مرتبطش بسازید تا اون مقدار براتون بگیره ولی اگر بخوایید که یه فیلد با اسم دلخواه داشته باشید که از یه کلید خواص دریافت کنه داستان کمی فرق میکنه که اون رو انتهای مقاله توضیح دادم براتون .

خوب برای اینکه بتونیم از این ریسپانس استفاده کنیم یه کلاس با اسمPostمیسازیم و شامل فیلد هایی میشه که کلید های داخل جیسون هستن به این شکل .

تا اینجا کار جزو کار های همیشگی ما بوده ! همون مدل سازی خودمون بر حسب نیاز و ریسپانس برگشتی از سرور قدم بعدی ما اینکه به این پکیج عزیز بگیم که اقا ما میخواییم شما باقی کارهاش انجام بدی! چجوری ؟ خیلی ساده میایم بالای کلاس یه annotation اضافه میکنیم تا متوجهش بشه این annotation عزیز هم اینشکلی هستش.

@JsonSerializable()

حالا قدم بعدی ما نوشتن متد های fromJson و toJson هستش با این فرق که دیگه ما نمیایم تک به تک بشینیم فیلد ها رو با دست بنویسیم فقط اسم فانکشن هارو مینویسیم و خلاص بقیش باید بسپاریم به این پکیج عزیز. نوشتن این متد ها هم فرق داره باهم به صورت پله پله میریم جلو اول از همه اینو بگم که با نوشتن این کد ها شاهد یکسری ارور ها داخل ادیتور میشد چون که هنوز فایل هاش جنریت نشده و عادی .

اول از همه متد fromJson مینویسیم، کد های این متد به شکل زیر میشه .

factory Post.fromJson(Map<String,dynamic>json)=>_$PostFromJson(json);

حالا نوبت متد toJson هستش و کد های اون هم به این شکل میشه .

Map<String, dynamic> toJson() => _$PostToJson(this);

خوب تا الان ما حدود ۹۰ درصد کارمون انجام دادیم بعد از نوشتن این دوتا متد نوبت میرسه که به دارت بگیم که این فایل قرار بخشی از یه فایلی باشه که کد های سریالاز درونش قرار میگیره و اون فایل توسط build_runner که به پروژه اضافه کردیم قرار جنریت بشه ، برای همین منظور بیاید بالای فایل و زیر ایمپورت هاتون این که میگم رو قرار بدین تا جنریتور متوجه بشه چه فایلی باید براتون جنریت کنه

part 'posts.g.dart';

داخل این تیکه کد شما باید اسم فایلی که برای مدل خودتون در نظر گرفتین رو با postsجایگذین کنید و دقت کنید که g.dart رو داشته باشید پس ساختار این کد برای شما به این شکل میشه

part 'fileName.g.dart';

به طور کلی کلاس مدل ما به این شکل در میاد .

خوب میدونم که الان ادیتور هاتون دارن داد میزنن که این فایل و این متد ها وجود نداره ، بیاین بهشون خلافش رو ثابت کنیم چجوری ؟! کافیه که دستور زیر رو داخل ترمینال ادیتور هاتون بزنید تا فایل و متد هاش رو جنریت کنید

flutter pub run build_runner build

خوب خوب بعد از زدن این دستور فایل ها جنریت میشن و کارتون به اتمام میرسه:) ولی عجله نکنید یادتون گفتم فیلد هایی که شما داخل کلاس مدل میسازید باید هم نام کلید های داخل جیسون باشه ؟ حالا اگه بخوایید نباشه چی ؟ برای اون هم راه حل داریم .

بیاین یه بار دیگه کلاس مدل رو ببینیم و اینسری یکی از فیلد ها رو جوری تعریف کنیم که هم نام با کلید های دریافتی نباشه مثلا من دلم نمیخواد id خالی بزارم چون با بقیه چیز ها به مشکل میخورم و میخوام که اسمش رو postId بزارم ولی کلید داخل ریسپاسنس id هستش برای اینکار کافیه که یه annotation دیگه به بالای همون فیلد اضافه کنید

خوب اول برای یاداوری مدل قبلی خودمون ببینیم

حالا میایم و تغییری که میخواییم به اون فیلد مورد نظر میدیم . من برای مثل میام اون id رو به postId تغییر میدم .اما اگر دوباره این فایل رو جنریت کنم اون فیلد توسط پکیج شناسایی نمیشه که مقدارش بگیره برای همین میایم و این annotation رو هم به بالاش اضافه میکنیم

@jsonKey(name:'id')

یه نکته بسیار مهم که باید بهش توجه کنید این هستش که در جای nameش ما باید مقداری بهش بدید که کلید اون در بخش ریسپانس، الان اسم اون فیلد postId هستش و با این annotation این فیلد مقدارش از کلید id دریافت میکنه و درنهایت تغییرات به این شکل در میاد

خوب خوب تا اینجا سعی کردم که به زبون ساده بهتون یاد بدم که چجوری از این پکیج برای کار هاتون استفاده کنید امیدوارم براتون مفید بوده باشه

شایان ذکر که این تنها پکیج برای انجام این کار نیست و پکیج های دیگه مثل freezed و built_value و... شامل میشه که سعی میکنم در اینده در مورد اون ها هم براتون بنویسم .

اگر که تا الان این مقاله و مقاله هاب قبلیم براتون جذاب بوده ممنون میشم که مقاله هام لایک کنید و برای بقیه دوستانتون بفرستید تا اونها هم با خوندنش بتونن استفاده کنن. خوشحال میشم به گیت هابم هم یه سر بزنید و روی ریپو هام استار بدین و کانتریبیوت کنید

ممنون که تا به اینجا با من بودین تا مقاله ای دیگه به درورد



flutterdartapicross platformandroid
уσυ нανє тσ ℓєαяη нσω тσ ƒιgнт αℓσηє! ?
شاید از این پست‌ها خوشتان بیاید