diff --git a/vue3/src/components/display/ShoppingListView.vue b/vue3/src/components/display/ShoppingListView.vue
index d323e836f..3888a51cb 100644
--- a/vue3/src/components/display/ShoppingListView.vue
+++ b/vue3/src/components/display/ShoppingListView.vue
@@ -236,6 +236,7 @@ import ShoppingListEntryInput from "@/components/inputs/ShoppingListEntryInput.v
 import {DateTime} from "luxon";
 import MealPlanEditor from "@/components/model_editors/MealPlanEditor.vue";
 import ModelEditDialog from "@/components/dialogs/ModelEditDialog.vue";
+import {onBeforeRouteLeave} from "vue-router";
 
 const {t} = useI18n()
 
@@ -326,6 +327,13 @@ function autoSyncLoop() {
     }, timeout)
 }
 
+/**
+ * cancel auto sync loop before leaving to another page
+ */
+onBeforeRouteLeave(() => {
+    clearTimeout(useShoppingStore().autoSyncTimeoutId)
+})
+
 /**
  * delete shopping list recipe
  */