アプリからフィールド選択UI追加

frontend/src/components/AppSelect.vue

@@ -17,7 +17,7 @@
   </div>
 </template>
 <script lang="ts">
-import { ref, onMounted, reactive, watch } from 'vue'
+import { ref, onMounted, reactive, watchEffect } from 'vue'
 import { api } from 'boot/axios';
 
 export default {
@@ -41,11 +41,9 @@ export default {
     const rows: any[] = reactive([]);
     const selected = ref([])
 
-    const updateExternalSelectAppInfo = props.updateExternalSelectAppInfo
-
-    watch(selected, (newValue, oldValue) => {
-      if (newValue && newValue[0] && updateExternalSelectAppInfo) {
-        updateExternalSelectAppInfo(newValue[0])
+    watchEffect(()=>{
+      if (selected.value && selected.value[0] && props.updateExternalSelectAppInfo) {
+        props.updateExternalSelectAppInfo(selected.value[0])
       }
     });
     onMounted(() => {
@@ -99,4 +97,4 @@ export default {
   min-height: 300px;
   min-width: 400px;
 }
-</style>
+</style>