您好,欢迎来到微智科技网。
搜索
您的当前位置:首页element-ui时间选择器(el-date-picker)-支持多种输入格式、中文格式

element-ui时间选择器(el-date-picker)-支持多种输入格式、中文格式

来源:微智科技网
element-ui时间选择器(el-date-picker)-⽀持多种输⼊格式、中

⽂格式

全局注册⾃定义指令

// 时间选择器 - 多种输⼊格式 Vue.directive('dateFormat', {

inserted: function (el, binding, vnode) { const { value: _obj } = binding

const { context: that, data } = vnode const { expression: key } = data.model if(that && that._isVue) {

const $this = $($(el).children('input')[0]) $this.on('change', function() { let value = $this.val()

// 中⽂⽇期

if (!value.match(/\\d{1,}/g)) {

const chinaNum = ['〇', '⼀', '⼆', '三', '四', '五', '六', '七', '⼋', '九'] const wList = [...value].map(w => {

const idx = chinaNum.findIndex(p => p == w) return idx == -1 ? w : idx })

value = wList.join('') }

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 } }) } } })

⽤法:v-date-format

v-model=\"form.applicantBirthday\" type=\"date\"

placeholder=\"请选择⽇期时间\" format=\"yyyy年MM⽉dd⽇\" value-format=\"yyyy-MM-dd\">

⾃定义赋值

v-date-format=\"{ keys: ['additionalInfo', 'otherInfo', i, 'infoValue'] }\" format=\"yyyy年MM⽉dd⽇\" v-model=\"p.infoValue\" type=\"date\"

placeholder=\"选择⽇期时间\" @change=\"translateTimes(p,i)\">

因篇幅问题不能全部显示,请点此查看更多更全内容

Copyright © 2019- 7swz.com 版权所有 赣ICP备2024042798号-8

违法及侵权请联系:TEL:199 18 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务