可自定义的vue下拉框组件

• 创建Select.vue组件

//创建Select.vue组件

<template>
  <div class="selects">
    <!-- 选择框 -->
    <div
      :class="{selects0show: !isshow,selects0hade: isshow}"
      class="selects0"
      @click="isshow=!isshow"
    >
      <p v-text="xz"></p>
      <img src="@/assets/home/z_x_jt.png" alt srcset />
    </div>
    <!-- 下拉框大盒子 -->
    <div
      :class="{show: !isshow,hade: isshow,issel:num>=4}"
      class="sel"
      :style="{height:35*num+'px'}"
    >
      <!-- 下拉框 -->
      <div
        @click="cutValue(i)"
        :style="{display: num >=(i+1)?'block':'none'}"
        v-for="(item,i) in num"
        :key="i"
        v-text="sel[i]"
      ></div>
    </div>
  </div>
</template>