GiveTypeSelect.vue

<template>
  <search-item
    label="赠送类型"
    
    :size="size"
  >
    <el-select
      clearable
      filterable
      :value="value"
      @change="changeHandle"
    >
      <el-option
        v-for="(item, index) in giveTypeList"
        :key="index"
        :value="item.value"
        :label="item.name"
      ></el-option>
    </el-select>
  </search-item>
</template>

<script>
import { mapGetters, mapActions } from 'vuex';

export default {
  name: 'give-select',
  props: {
    size: {
      type: String,
      default: '',
    },
    value: {
      type: String,
      default: '',
    },
  },
  mounted() {
    if (!this.giveTypeList.length) {
      this.fetchGiveTypeList();
    }
  },
  computed: {
    ...mapGetters(['giveTypeList']),
  },
  methods: {
    ...mapActions(['fetchGiveTypeList']),
    changeHandle(val) {
       this.$emit('input', val);
           
    },
    getTypeName(val){
      let item = this.giveTypeList.find(({value}) => val === value);
      return item?item.name: '';
    }
  },
};
</script>