add configuration to let user have a custom behavior for form

Author: AMontagu

README.md

@@ -115,6 +115,7 @@ Configurations object allow you to personnalize the behavior of vue-datatable-ur
 | debounceTime | 0 | Allow you to specify a debounce time before sending request to your server. This is usefull when you have only text field but can bring lag feeling when using checkbox or select. You can also use debounce directly in your component to personalize this behavior |
 | serveurDefaultPageSize | 10 | The default value for you backend pagination to be sure to send it if the default value in front is different that the one in your back |
 | extraQueryParams | {} | Put variable in the url and send them to your back even if not in your form |
+| updateFormFunction | null | Use a custom function to update form instead of direct assignation. Usefull when form is a props and you want to emit an event because form is not mutable. |
 
 # FormSchema 
 

package-lock.json

@@ -31,6 +31,8 @@ export default function useDatatableUrlSync(route: any, router: any, form: Ref<G
     serveurDefaultPageSize: 10,
     // This mean to be overrided to add query params that are fixed and should not appear in url
     extraQueryParams: {},
+    // this is used when you have special behavior to update your form like emit event instead of direct assignation
+    updateFormFunction: null,
     ...configurations || {}
   }
   options.value = {
@@ -233,7 +235,12 @@ export default function useDatatableUrlSync(route: any, router: any, form: Ref<G
     if (isEqual(form.value, newForm)) {
       return false;
     }
-    form.value = newForm;
+    // Let user update his form as he want to.
+    if (configurations?.updateFormFunction) {
+      configurations?.updateFormFunction(newForm)
+    } else {
+      form.value = newForm;
+    }
     return true;
   }
 

src/useDatatableUrlSync.ts

@@ -23,6 +23,7 @@ type VDUSConfiguration = {
   debounceTime?: number;
   serveurDefaultPageSize?: number;
   extraQueryParams?: GenericDictionnary;
+  updateFormFunction?: Function | null;
 }
 
 type VuetifySortArraysObject = {