update: Optimized phone validator component with regex

getdokan · Aug 18, 2023 · 67d62da · 67d62da
1 parent 82a71ec
commit 67d62da
Showing 1 changed file with 3 additions and 12 deletions.
diff --git a/src/admin/pages/VendorAccountFields.vue b/src/admin/pages/VendorAccountFields.vue
@@ -63,7 +63,7 @@
 
                 <div class="column">
                     <label for="store-phone">{{ __( 'Phone Number', 'dokan-lite') }}</label>
-                    <input type="text" id="store-phone" class="dokan-form-input" v-model="vendorInfo.phone" @input.prevent="validatePhoneInput" :placeholder="__( '+123456789', 'dokan-lite')">
+                    <input type="text" id="store-phone" class="dokan-form-input" v-model="vendorInfo.phone" @input.prevent="validatePhoneInput" :placeholder="__( '+123456789', 'dokan-lite' )">
                 </div>
 
                 <div class="column">
@@ -377,17 +377,8 @@ export default {
         },
 
         validatePhoneInput( event ) {
-            if ( ! event.data ) {
-                return;
-            }
-
-            const allowedChars = [ '0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '(', ')', '+', '-', '_', '.' ];
-
-            // If the input character is valid.
-            if ( ! allowedChars.includes( event.data.at( -1 ) ) ) {
-                this.vendorInfo.phone = this.vendorInfo.phone.slice(0, -1);
-            }
-        }
+            this.vendorInfo.phone = this.vendorInfo.phone.replace( /[^0-9\\.\-\_\(\)\+]+/g, '' );
+        },
     }
 };
 </script>