yos_web/src/components/down_select/index.vue

<template>
  <div class="select1">
    <p>{{title}}</p>
    <el-select v-model="result" clearable @clear="clearCatory" placeholder="请选择" size="small" @change="change" width="100px">
      <el-option
        v-for="item in list"
        :key="item.value"
        :label="item.label"
        :value="item.value">
      </el-option>
    </el-select>
  </div>
</template>

<script>
export default {
  name: '',
  data() {
    return {
      result:this.default == true ? this.list[0] ? this.list[0].value : '' : ''
    };
  },
  props:['title','list','default'],
  computed:{
  },
  watch:{
  },
  methods: {
    change() {
      this.$emit('selectChange',this.result)
    },
    clearCatory() {
      this.$emit('clearCategory')
    }
  },
};
</script>

<style scoped>
  .select1 {
    display: flex;
    align-items: center;
  }
  p {
    margin-right: 8px;
    font-size: 14px;
    color: #666666;
  }
  /deep/.el-select {
    width: 150px !important;
  }
</style>