• 1403/08/08

حفظ موقعیت اسکرول بعد از برگشت به صفحه قبلی :

سلام

من ی سایت دارم که در یک قسمتش

منو و جستجو دارم

حالا میخوام بعد از اینکه منو انتخاب کرد و روی یک محصول کلیک کرد، وقتی محصول رو دید و خواست برگرده یک محصول دیگه ببینه، دوباره همونجایی که بوده برگرده،

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

میشه لطفا راهنمایی کنید چطوری انجامش بدم.

واقعا ایده ای ندارم

پروژه با next نوشته شده.

مرسی

  • 1403/08/09
  • ساعت 11:29

سلام دوست من

این راه حل، اطلاعات کاربر رو در حین جستجو و انتخاب منوها ذخیره می‌کنه تا بعد از بازگشت، دوباره بارگذاری بشه. مثلاً هر موقعیت اسکرول و انتخاب‌های انجام‌شده رو ذخیره کن و موقع بازگشت، دوباره این اطلاعات رو بارگذاری کن.

// ذخیره موقعیت اسکرول و انتخاب‌ها
const saveScrollPosition = () => {
    sessionStorage.setItem('scrollPosition', window.scrollY);
    sessionStorage.setItem('selectedMenu', JSON.stringify(selectedMenu));
    sessionStorage.setItem('searchQuery', searchQuery);
};

// بارگذاری موقعیت اسکرول و انتخاب‌ها
const loadScrollPosition = () => {
    const scrollPosition = sessionStorage.getItem('scrollPosition');
    const menu = JSON.parse(sessionStorage.getItem('selectedMenu'));
    const query = sessionStorage.getItem('searchQuery');

    if (scrollPosition) window.scrollTo(0, scrollPosition);
    if (menu) setSelectedMenu(menu);
    if (query) setSearchQuery(query);
};

با استفاده از این روش نیازی به نصب پکیج های بیرونی نداری


logo-samandehi