在这个示例中,suffix-icon属性被设置为空字符串"",这样就会隐藏下拉框右侧的箭头。
在el-input中可以通过prefix-icon(首部)和suffix-icon(尾部)属性在 input 组件增加显示图标,也可以通过 slot 来放置图标。如下图: 代码如下: <divclass="demo-input-suffix">属性方式:<el-inputplaceholder="请选择日期"suffix-icon="el-icon-date"v-model="input1"></el-input><el-inputplaceholder="请输入...
1.最简单的方法:改el-input右边的padding值,但是自适应的时候宽度会不统一; 2.使用占位图标:也在右边的位置追加一个不存在的图标suffix-icon="xxxx"
.el-input__suffix.el-input__suffix-inner{// 解决聚焦的时候会有闪现一下滚动条.el-input__icon{transform:rotateZ(0deg);// transition: transform 20s;// background: pink;&::before{display:inline-block;transition:transform.3s;transform:rotateZ(180deg);}&.is-reverse::before{transform:rotateZ(...
.el-input__suffix { top: 0px; display: flex; justify-content: center; align-items: center; flex-wrap: nowrap; flex-direction: row; align-content: flex-start; } .el-input__icon { line-height: 26px; color: rgba(0, 194, 255, 1); ...
</template> <template slot="suffix"> <i v-show="!showClose" :class="['el-select__caret', 'el-input__icon', 'el-icon-' + iconClass]"></i> <i v-if="showClose" class="el-select__caret el-input__icon el-icon-circle-close" @click="handleClearClick">...
.el-input__suffix.el-input__suffix-inner{// 解决聚焦的时候会有闪现一下滚动条.el-input__icon{transform:rotateZ(0deg);// transition: transform 20s;// background: pink;&::before{display:inline-block;transition:transform.3s;transform:rotateZ(180deg);}&.is-reverse::before{transform:rotateZ(...
.el-input__suffix-inner { i { background: url("./assets/icon_down.png") center center no-repeat; background-size: 10px 6px; width: 10px; height: 6px !important; svg { display: none !important; } } } } 完整实例代码 <template> ...
:suffix-icon="IconDropDown" @change="getJobsFn" > <el-option v-for="item in salaryList" :key="item.id" :label="item.name" :value="item.id" /> </el-select><br><br> import IconDropDown from '@/components/IconDropDown.vue' 联级选择器 .search-box-el { .el-input__inner::pla...