daimp-front/sub-government-affairs-service/src/components/LandIsTransfer.vue

<template>
  <el-select v-model="val" @change="change">
    <el-option v-for="item in options" :key="`land_type_${item.value}`" :value="item.value" :label="item.label" :placeholder="props.placeholder">
      {{ item.label }}
    </el-option>
  </el-select>
</template>

<script setup>
import { ref, watch } from 'vue';

const props = defineProps({
  // 父组件传过来的值
  value: {
    type: String || Number || null,
    default: null,
  },
  placeholder: {
    type: String,
    default: '请选择',
  },
});
const emit = defineEmits(['update:value']);
/* --------------- data --------------- */
// #region

const val = ref(null);
watch(
  () => props.value,
  () => {
    val.value = props.value || props.value == 0 ? String(props.value) : null;
  },
  {
    deep: true,
    immediate: true,
  }
);
const options = ref([
  { label: '是', value: '0' },
  { label: '否', value: '1' },
]);

// #endregion

/* --------------- methods --------------- */
// #region
function change(val_) {
  val.value = val_;
  emit('update:value', val_);
}
// #endregion
</script>

<style lang="scss" scoped></style>