element组件 解决DateTimePicker + vue 弹出框只显示小时和“至”字处理

需求:选择时间为时间段,且只显示年月日时

代码如下:

<el-date-picker class="box" v-model="dataForm.talkTmList" type="datetimerange" format="yyyy-MM-dd HH"
   	value-format="yyyy-MM-dd HH" placeholder="日期" range-separator=""
    start-placeholder="开始时间" style="width:100%" popper-class="tpc"
    end-placeholder="结束时间">
</el-date-picker>
<style>
  /* ‘至’字 全部显示 */
  .box .el-range-separator{
    
    
    width: 20px !important;
  }
  /* 只显示时 隐藏分 */
  .tpc .el-time-spinner__wrapper {
    
    
    width:100% !important;
  }
  .tpc .el-scrollbar:nth-of-type(2) {
    
    
    display: none !important;
  }
</style>

注:不可在带有scoped标记的style标签中!

效果如下图

在这里插入图片描述
阅读以下文章解决:
https://blog.csdn.net/tianshi527/article/details/114766526

猜你喜欢

转载自blog.csdn.net/weixin_43883951/article/details/122376621