refs #6772 perf: use ArrayData

src/components/ui/VnPaginate.vue

@@ -94,25 +94,7 @@ watch(
 );
 watch(
     () => route.params.id,
-    () => {
-        if (route.path === props.url) return;
-        //Así fuerzo al reinicio
-        store.data = null;
-        if (!arrayData.store?.filter?.where) {
-            //Cuando el cambio viene por VnSearchbar
-            if (route.params.id) store.url = store.url.replace(/(\d+)/, route.params.id);
-        } else {
-            // Cuando el usuario cambia en la URL
-            const keyFk = Object.keys(arrayData.store.filter.where).find((key) =>
-                key.endsWith('Fk')
-            );
-            if (keyFk) {
-                arrayData.store.filter.where[keyFk] = route.params.id;
-            }
-        }
-
-        fetch();
-    }
+    () => arrayData.reloadRoute()
 );
 async function fetch() {
     await arrayData.fetch({ append: false });

src/composables/useArrayData.js

@@ -34,6 +34,26 @@ export function useArrayData(key, userOptions) {
         setOptions();
     }
 
+    function reloadRoute() {
+        if (route.path === store.url) return;
+        //Así fuerzo al reinicio
+        store.data = null;
+        if (!store?.filter?.where) {
+            //Cuando el cambio viene por VnSearchbar
+            if (route.params.id) store.url = store.url.replace(/(\d+)/, route.params.id);
+        } else {
+            // Cuando el usuario cambia en la URL
+            const keyFk = Object.keys(store.filter.where).find((key) =>
+                key.endsWith('Fk')
+            );
+            if (keyFk) {
+                store.filter.where[keyFk] = route.params.id;
+            }
+        }
+
+        fetch({ append: false });
+    }
+
     function setOptions() {
         const allowedOptions = [
             'url',
@@ -210,5 +230,6 @@ export function useArrayData(key, userOptions) {
         totalRows,
         updateStateParams,
         isLoading,
+        reloadRoute,
     };
 }