<template>
  <a-select :value="value" @change="selectChange" :placeholder="placeholder">
    <a-select-option v-for="item in options" :key="item.key" :value="item.key">
      {{ item.value }}
    </a-select-option>
  </a-select>
</template>

<script>
export default {
  name: 'DictSelect',
  props: {
    dictType: {
      type: String,
      default: null
    },
    value: {
      type: [String, Number],
      default: null
    },
    placeholder: {
      type: String,
      default: '请选择'
    },
    allOption: {
      type: Boolean,
      default: false
    }
  },
  model: {
    // model 表示使用该组件时v-model指令会绑定到props中的value变量，当该组件触发handleChange事件时，父组件的value也会被更新
    prop: 'value',
    event: 'handleChange'
  },
  mounted() {
    // 加载完成后，根据传入的dictType初始化下拉选项
    if (this.allOption) {
      this.options = [
        {
          key: '',
          value: '全部'
        }
      ]
    }
    this.options.push({
      key: 1,
      value: '病毒'
    })
  },
  data() {
    return {
      options: []
    }
  },
  methods: {
    selectChange(val) {
      // 告诉父节点v-model绑定的值变化了，父组件更新value值，再次传递新值给该组件，该组件value更新
      this.$emit('handleChange', val)
    }
  }
}
</script>
