瀏覽代碼

[ui] Vue 3 - Migrated SearchInput component

sreenaths 4 年之前
父節點
當前提交
e5ecb031ec
共有 1 個文件被更改,包括 32 次插入18 次删除
  1. 32 18
      desktop/core/src/desktop/js/components/SearchInput.vue

+ 32 - 18
desktop/core/src/desktop/js/components/SearchInput.vue

@@ -51,27 +51,41 @@
 </template>
 
 <script lang="ts">
+  import { defineComponent } from 'vue';
+
   import I18n from '../utils/i18n';
-  import Vue from 'vue';
-  import Component from 'vue-class-component';
-  import { Prop } from 'vue-property-decorator';
-
-  @Component
-  export default class SearchInput extends Vue {
-    @Prop({ required: false, default: true })
-    showMagnify?: boolean;
-    @Prop({ required: false, default: I18n('Search...') })
-    placeholder?: string;
-    @Prop({ required: false, default: '' })
-    value?: string;
-
-    spin = false;
-    autocomplete = '';
-    throttle = -1;
-    hasFocus = false;
+
+  export default defineComponent({
+    props: {
+      showMagnify: { type: Boolean, required: false, default: true },
+      placeholder: {
+        type: String,
+        default: I18n('Search...')
+      },
+      value: {
+        type: String,
+        default: ''
+      }
+    },
+
+    emits: ['input', 'search'],
+
+    data(): {
+      spin: boolean;
+      autocomplete: string;
+      throttle: number;
+      hasFocus: boolean;
+    } {
+      return {
+        spin: false,
+        autocomplete: '',
+        throttle: -1,
+        hasFocus: false
+      };
+    }
 
     // TODO: Add autocomplete logic...
-  }
+  });
 </script>
 
 <style lang="scss" scoped>