تنظیم امکان بازگشت و رفتار دکمه بازگشت در اپسان

مقدمه

در این راهنما، به نحوه‌ی مدیریت رفتار دکمه بازگشت در اپسان وب پرداخته می‌شود. اپسان وب به توسعه‌دهندگان اجازه می‌دهد تا امکان بازگشت و عملکرد دکمه بازگشت را سفارشی کنند و یا از رفتار پیش‌فرض آن استفاده کنند.

استفاده از رفتار پیش‌فرض

رفتار پیش‌فرض اپسان بر اساس تعداد صفحات موجود در تاریخچه عمل می‌کند:

بسته شدن اپلیکیشن: اگر تعداد صفحات موجود در تاریخچه ≤ 1 باشد، اپلیکیشن بسته می‌شود.

بازگشت به صفحه قبلی: اگر تاریخچه بیشتر از 1 صفحه داشته باشد، به صفحه قبلی بازمی‌گردد. در صورت تعریف customBackHandler، این تابع به جای رفتار پیش‌فرض اجرا می‌شود.

پاک کردن تاریخچه

برای پاک کردن تاریخچه و تنظیم تعداد صفحات موجود، می‌توانید از تابع پیش‌فرض clearBackStack استفاده کنید:

AppsanWeb.getAvailableHistoryCountProvider()?.clearBackStack();

قابلیت customBackHandler در AppsanWeb

این متد تنها در صورتی صدا می شود که availableBackCount بزرگ تر از 1 باشد.

تعریف customBackHandler: این متغیر می‌تواند تابع شما را ذخیره کند که هنگام فشار دادن دکمه بازگشت اجرا می‌شود.

متد setCustomBackHandler: برای تنظیم تابع سفارشی استفاده می‌شود:

AppsanWeb.setCustomBackHandler(() => {

 // handle back here your way

});

توجه: هنگام استفاده از تابع سفارشی، رفتار پیش‌فرض اجرا نمی‌شود و می‌توانید با اکشن app/forceback بازگشت انجام دهید.

تنظیم availableBackCount

برای تغییر availableBackCount در سوپر اپ از روش زیر استفاده کنید

(AppsanWeb as any).instance.post((AppsanWeb as any).MESSAGE_TYPE_AVAILABLE_HISTORY_COUNT, <back_count>);

سفارشی‌سازی امکان بازگشت

برای تعریف رفتار خاص بازگشت، یک کلاس جدید از رابط AvailableBackCountProvider پیاده‌سازی کنید. این رابط شامل متدهای زیر است:

getAvailableHistoryCount(): تعداد صفحات موجود را برمی‌گرداند.

clearBackStack(): تاریخچه را پاک و بازنشانی می‌کند.

نمونه: غیرفعال کردن بازگشت و بستن مینی‌اپ

import { AppsanWeb, AvailableBackCountProvider } from "./AppsanWeb";

export class DisableBackAndCloseProvider implements AvailableBackCountProvider {

 getAvailableHistoryCount(): number {

 return 1;

 }

 clearBackStack(): void {

 // No-op: back is effectively disabled

 }

}

با بازگرداندن ۱ در getAvailableHistoryCount()، بازگشت غیرفعال و مینی‌اپ بسته می‌شود.

نمونه پیاده‌سازی ارائه‌دهنده سفارشی تأیید قبل از بازگشت

import { AppsanWeb, AvailableBackCountProvider } from "./AppsanWeb";export class ConfirmableBackCountProvider implements AvailableBackCountProvider { private availableHistoryCount = 1; constructor() { // Patch history.pushState so we can track forward navigation const h = window.history as any; const originalPushState = h.pushState; h.pushState = (...args: any[]) => { this.onPushState(); return originalPushState.apply(h, args); }; // Track browser back/forward via popstate window.addEventListener("popstate", () => this.onPopState()); // Hook custom back handler to show a confirmation dialog AppsanWeb.setCustomBackHandler(() => this.showConfirmationDialog()); } private onPushState(): void { this.availableHistoryCount++; (AppsanWeb as any).instance.post( (AppsanWeb as any).MESSAGE_TYPE_AVAILABLE_HISTORY_COUNT, this.availableHistoryCount ); } private onPopState(): void { this.availableHistoryCount = Math.max(0, this.availableHistoryCount - 1); (AppsanWeb as any).instance.post( (AppsanWeb as any).MESSAGE_TYPE_AVAILABLE_HISTORY_COUNT, this.availableHistoryCount ); } getAvailableHistoryCount(): number { return this.availableHistoryCount; } clearBackStack(): void { this.availableHistoryCount = 1; (AppsanWeb as any).instance.post( (AppsanWeb as any).MESSAGE_TYPE_AVAILABLE_HISTORY_COUNT, 1 ); } private showConfirmationDialog(): void { if (confirm("آیا مطمئن هستید می‌خواهید بازگشت کنید؟")) { history.back(); } }}

نحوه استفاده

نمونه سازنده را بسازید:

const backHandler = new ConfirmableBackCountProvider();

کلاس ساخته شده را به setAppsanBackCountProvider بدهید