目录
一、清除表单的验证
问题的发生以及解决过程
代码
总结
二、复合型输入框——查询（前置和后置都有的）
问题的发生以及解决过程
代码
展示
一、清除表单的验证
问题的发生以及解决过程
表单弹窗关闭后再打开会出现上一次的验证信息提示，影响使用。翻了翻文档，发现我们可以使用clearValidate（）方法将验证信息移除。即每次监听弹窗的打开，一旦弹窗打开就清除，然而发现没有用T-T
然后想起了之前大佬教的试试延时使用，果不其然生效了！！
代码
watch: {bdFormVisible (val) { // 当弹窗打开时// 重置表单，清空校验信息this.$nextTick(() => {// 延时到下一帧才开始，也就是页面刚刚渲染结束！！this.$refs.newBd.clearValidate()})}}
总结
长记性了，下次在遇到函数没有跑的，延时试一试
二、复合型输入框——查询（前置和后置都有的）
问题的发生以及解决过程
当初是想要做一个查询的输入框，发现官方文档中有一个很合适，就直接复制粘贴了，然后就出现了问题——左侧的下拉选中以后无法显示 T-T。
然后我试了试有两种方式可以解决，第一种是就是基于官方文档的修改（就是没有注意一些小细节），slot就是文档上的prepend，然后设置select的宽度，如果整个搜索框觉得太长了，可以用.input-with-select（文档里的类型）设置宽度
第二种就是我没发现上面第一种的细节然后折腾出来的，第二种就是修改slot为prefix，然后更改select的宽度，并且将input的padding-left设置为select的宽度即可
代码
第一种
第一种<el-inputplaceholder="请输入内容"v-model="select"class="input-with-select"><el-select v-model="selectLabel" slot="prepend" placeholder="请选择"><el-option v-for="item in optionSelect" :key="item.value" :label="item.text" :value="item.value"></el-option></el-select><el-button slot="append" icon="el-icon-search"></el-button></el-input>/ps: 在data里的定义我就不写出来了/style.el-select {width: 130px;}.input-with-select {background-color: #fff;width: 50%;}
第二种
------第二种-------<el-inputplaceholder="请输入内容"v-model="select"class="input-with-select"><el-select v-model="selectLabel" slot="prefix" placeholder="请选择"><el-option v-for="item in optionSelect" :key="item.value" :label="item.text" :value="item.value"></el-option></el-select><el-button slot="append" icon="el-icon-search"></el-button></el-input>/ps: 在data里的定义我就不写出来了/----style----.el-select {width: 130px;}.el-input {padding-left: 130px}.input-with-select .el-input-group__prepend {background-color: #fff;}
展示
第一种
第二种
