Define 'queryParam' in data

smori1983 · Oct 1, 2023 · 8e8c9a6 · 8e8c9a6
1 parent f7195c6
commit 8e8c9a6
Showing 1 changed file with 6 additions and 4 deletions.
diff --git a/src/components/Form.vue b/src/components/Form.vue
@@ -50,6 +50,8 @@ export default {
 
       query: '',
       searchResult: [],
+
+      queryParam: 'q',
     };
   },
 
@@ -59,26 +61,26 @@ export default {
       this.database.add(locale, data[locale] || {});
     }
 
-    this.query = this.$router.currentRoute.query.q || '';
+    this.query = this.$router.currentRoute.query[this.queryParam] || '';
     this.updateSearchResult();
   },
 
   watch: {
     $route (to, from) {
-      this.query = to.query.q || '';
+      this.query = to.query[this.queryParam] || '';
       this.updateSearchResult();
     },
   },
 
   methods: {
     submit () {
-      const queryParam = this.$router.currentRoute.query.q || '';
+      const queryParam = this.$router.currentRoute.query[this.queryParam] || '';
       const query = this.query;
       if (queryParam !== query) {
         this.$router.push({
           path: this.$router.currentRoute.path,
           query: {
-            q: query,
+            [this.queryParam]: query,
           },
         });
       }