el-select 设置宽度自适应上层div

在标签el-select中,添加style=“display:block;”

宽度将由上层div宽度决定

display: grid;

grid-template-columns: minmax(auto,400px);

上层div配合grid布局

达到select选择框最大宽度400px,自适应小屏幕的效果

 <el-col :span="8">
          <el-form-item label="供应商名" prop="supplier" :class="{ 'is-required': !dataForm.id}">
            <el-select class="SelectWidth" v-model="SelectCheckOrgValue" placeholder>
              <el-option
                v-for="(select ,index) in SelectCheckOrg"
                :key="index"
                :label="select.orgName"
                :value="select.orgName"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>

<style lang="scss" scoped>
.ShowInput {
  max-width: 200px;
  min-width: 180px;
}
.SelectWidth {
  display: block;
}
</style>

你可能感兴趣的:(WebSan)