vue element 修改el-select控件的长度 style=“width:XXpx“不生效的问题

问题：想要修改一个代码如下，里面的select的长度，然后单纯地通过设置style="width:200px"发现不生效，实际控件可触控区域以及占据区域确实变长了，但是视觉上没有变化。

<template>
    <div class="formHeader">
            <div style="margin-left:20px">
                    <span>选项：</span>
                    <el-select v-model="form.selectValue" placeholder="请选择" style="width:200px">
                        <el-option
                                v-for="item in selectOption"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                        </el-option>
                    </el-select>
             </div>
    </div>
</template>

.formHeader .el-input {
    border-color: #409EFF;
    width: 150px;
}

原因：Element-UI 的 el-select （el-cascader也是）使用的其实是 input 标签 , 而 input 标签在浏览器中存在一个默认的宽度 , 大约是 100px (不同的浏览器表现不同) 。而如上图所示，我设置了el-input的宽度为150px，所以在底层，使用的input还是150px。

解决方法：
设置如下样式即可：

    .fromHeader .el-select .el-input {
        border-color: #409EFF;
        width: 200px;
    }