refactor: 规范化代码.

orion-ops-ui/src/components/system/dict-key/dict-key-selector.vue

@@ -1,6 +1,6 @@
 <template>
   <a-select v-model:model-value="value as any"
-            :options="optionData()"
+            :options="optionData"
             :allow-search="true"
             :loading="loading"
             :disabled="loading"
@@ -17,7 +17,7 @@
 
 <script lang="ts" setup>
   import type { SelectOptionData } from '@arco-design/web-vue';
-  import { computed } from 'vue';
+  import { computed, onBeforeMount, ref } from 'vue';
   import { useCacheStore } from '@/store';
   import { labelFilter } from '@/types/form';
 
@@ -32,6 +32,9 @@
 
   const emits = defineEmits(['update:modelValue', 'change']);
 
+  // 选项数据
+  const cacheStore = useCacheStore();
+
   const value = computed({
     get() {
       return props.modelValue;
@@ -54,17 +57,17 @@
       }
     }
   });
+  const optionData = ref<Array<SelectOptionData>>([]);
 
-  // 选项数据
-  const cacheStore = useCacheStore();
-  const optionData = (): SelectOptionData[] => {
-    return cacheStore.dictKeys.map(s => {
+  // 初始化选项
+  onBeforeMount(() => {
+    optionData.value = cacheStore.dictKeys.map(s => {
       return {
         label: `${s.keyName} - ${s.description || ''}`,
         value: s.id,
       };
     });
-  };
+  });
 
 </script>