el-select修改宽度问题解决方案

1、当placeholder过长时

1、样式

2、代码

	<el-select remote filterable clearable placeholder="请输入发布单元英文名(支持模糊搜索)" :remote-method="remoteMethod">
		<el-option v-for="v in items" :key="v.id" :value="v.id" :label="v.name" />
	</el-select>

2、网上其他人的解决方案

1、设置style="width:100%"与父盒子同宽，改变父盒子的宽度即可

	<el-select v-model="value5" multiple placeholder="请输入发布单元英文名(支持模糊搜索)" style="width:100%">
		<el-option v-for="v in items" :key="v.id" :value="v.id" :label="v.name" />
	</el-select>

2、不适用原因

因为一般el-select都是放在表单内使用，所以大部分代码都是用el-form-item包裹的，而我这里使用的是一个搜索框，外面需要用div包裹。

3、解决方案

1、代码部分

	<div class="unitSearch">
		<el-select style="display: block; width: 100%;" remote filterable clearable placeholder="请输入发布单元英文名(支持模糊搜索)" :remote-method="remoteMethod">
			<el-option v-for="v in items" :key="v.id" :value="v.id" :label="v.name" />
		</el-select>
	</div>

.unitSearch{
    display: inline-block;
    margin-right: -5px;
    .el-input{
      width:300px !important;
    }
    .el-input__inner{
      width:300px !important;
    }
    .el-input--suffix .el-input__inner{
      width:300px !important;
    }
    .el-input__icon{
      height:100%;
    }
}

2、div设置类名，然后修改css样式

注意：
1、el-select要加上样式style="display: block; width: 100%;"；
2、如果style加了scoped可能会导致样式不生效，在.unitSearch前加上/deep/即可。