[ElemeFE/element]el-date-picker应该恢复输入时多种格式的支持,而不是只支持yyyy-MM-dd

2024-08-14 53 views
7
Element UI version

v2.14.1

OS/Browsers version

MAC/Win

Vue version

^2.6.10

目前只支持yyyy-MM-dd的固定格式输入

应该支持多种时间格式例如:yyyy/MM/dd、yyyyMMdd等,貌似在2.9.2版本以后这种支持就废弃了,为啥呢?Bug?

回答

9

去看文档 format

9

@3344567 键盘输入的格式,并不是选择后展示的格式

0

输入不应该是用户完成的吗?展示才是你或组件需要完成的

9

简单来说就是,用户以目前通用的时间格式输入,例如:20120512、2012-05-12、2012/05/12,选择器能匹配选择上对应的日期,对比一下2.8之前的版本

1

如果输入的是不符合的格式,为什么不是开发者通过blur事件去手动完成格式化

4

面临同样的问题

8

@mugongxu 这个问题解决了么

3

试了下如果不符合指定日期格式,onblur事件获取到的value为“”

5

如果需要实现这样的功能,可以参考一下这篇文章 https://www.cnblogs.com/senjer/p/13524032.html。 我根据文章思路做了yyyyMMdd格式的处理,其余情况,可以自己看着添加。 我的代码 directive.js

import Vue from "vue";

//时间选择器-yyyyMMdd输入格式
Vue.directive("elDateFormat", {
  inserted: function(el, binding, vnode) {
    const { value: _obj } = binding;
    const { context: that, data } = vnode;
    const { expression: key } = data.model;
    if (that && that._isVue) {
      console.log(el);
      const $this = el.children[0];
      $this.onchange = function() {
        let value = $this.value; //中文日期
        console.log(value);
        if (value.match(/\d{1,}/g) && value.length == 8) {
          value = value.replace(
            /^(\d{4})\D*(\d{1,2})\D*(\d{1,2})\D*/,
            "$1-$2-$3"
          ); //格式化输入格式
          const time =
            value && value.constructor == String ? new Date(value) : value; //转换时间格式
          let keys = key.split("."); //自定义赋值
          if (_obj) {
            const { keys: keyList } = _obj;
            keys = keyList;
          }
          if (keys && keys.length >= 2) {
            const [key1, key2, key3, key4] = keys;
            if (key4) {
              that[key1][key2][key3][key4] = time;
            } else if (key3) {
              that[key1][key2][key3] = time;
            } else {
              that[key1][key2] = time;
            }
          } else {
            that[key] = time;
          }
        }
      };
    }
  }
});