1.问题
elementUI默认日期组件是这样的：
想要的效果 ：
需要修改的有两处：
1.将‘至’换成箭头图标
2.将左侧的icon移动到右边
2.解决
总共需要修改的只有三处
template修改： <el-date-picker v-model="value12" @change="selectTime" type="datetimerange" range-separator="" //这里设置为空字符串 start-placeholder="开始日期" end-placeholder="结束日期" /> -------------------------------------------------------------------------------------- style样式新增：--隐藏左侧的图标 ::v-deep .el-range__icon { display: none; } ------------------------------------------------------------------------------------ mounted生命周期新增： mounted () { //el-icon-right向右的箭头--可以根据需要换成别的 document.getElementsByClassName('el-range__close-icon')[0].className += ' el-icon-date' document.getElementsByClassName('el-range-separator')[0].className += ' el-icon-right' }
