watchEffect -> watch

src/components/input/FormSelect.vue

@@ -16,7 +16,7 @@
 </template>
 
 <script setup>
-import { ref, watch, watchEffect } from 'vue';
+import { ref, watch } from 'vue';
 
 const props = defineProps({
     title: {
@@ -69,13 +69,16 @@ const props = defineProps({
 const emit = defineEmits(['update:data']);
 const selectData = ref(props.value);
 
-
+// data 변경 감지
-watchEffect(() => {
+watch(() => props.data, (newData) => {
-    if (props.isCommon && props.data.length > 0) {
+    if (props.isCommon && newData.length > 0) {
-        selectData.value = props.data[0].value; // 첫 번째 옵션의 값으로 설정
+        selectData.value = newData[0].value;
-    } else {
+        emit('update:data', selectData.value);
-        selectData.value = props.value; // 기본값으로 설정
     }
-    emit('update:data', selectData.value);
+}, { immediate: true });
-})
+
+// selectData 변경 감지
+watch(selectData, (newValue) => {
+    emit('update:data', newValue);
+});
 </script>