vue自定义指令elementui日期组件手动输入

devtools/2024/9/25 4:37:22/

html

 <el-form-item label="开始时间" prop="beginTime"><!-- :picker-options="pickerOptions" --><el-date-pickerv-model="formData.beginTime"v-elDateFormateditablevalue-format="yyyyMMdd"type="date"placeholder="请选择日期"clearablestyle="width: 180px"/>
</el-form-item>

scipt

  // 自定义指令directives: {elDateFormat: {inserted: function(el, binding, vnode) {const { value: _obj } = bindingconst { context: that, data } = vnodeconst { expression: key } = data.modelif (that && that._isVue) {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 } = _objkeys = keyList}if (keys && keys.length >= 2) {const [key1, key2, key3, key4] = keysif (key4) {that[key1][key2][key3][key4] = time} else if (key3) {that[key1][key2][key3] = time} else {that[key1][key2] = time}} else {that[key] = time}}}}}}},

http://www.ppmy.cn/devtools/88562.html

相关文章

HarmonyOS 用List组件实现组合列表项

界面分析&#xff1a; 由于整体UX设计图符合从上至下的布局&#xff0c;所以可以采用Column组件作为外层容器 简介&#xff1a; 最上方的标题可以使用Text组件进行加载渲染中间的Banner图和简介分别可以使用Image组件和Text组件进行加载最后一部分可以看作是一个列表&#xf…

图片转换之heic转jpg(使用ImageMagick)

缘由&#xff1a;iphone的图库&#xff0c;用jpg拍照保存后内存占比较大&#xff0c;heic格式会微缩不少。问题来了&#xff0c;电脑不能直接小图预览heic。 分析&#xff1a;现在就是解决小图预览的问题&#xff08;大图用wps可以看&#xff09; 解决&#xff1a;查找了一些…

距离-小米2023笔试(codefun2000)

题目链接 距离-小米2023笔试(codefun2000) 题目内容 在x轴上&#xff0c;给定当前坐标x0 &#xff0c;以及若干个坐标及坐标的值xi :vali &#xff0c;要求找到离x0最近的那个坐标并输出其值val。如果恰好在两个坐标的正中间&#xff0c;那么输出它们值的平均值。 输入描述 包…

《LeetCode热题100》---<5.③普通数组篇五道>

本篇博客讲解LeetCode热题100道普通数组篇中的五道题 第五道&#xff1a;缺失的第一个正数&#xff08;困难&#xff09; 第五道&#xff1a;缺失的第一个正数&#xff08;困难&#xff09; 方法一&#xff1a;将数组视为哈希表 class Solution {public int firstMissingPosi…

Android14音频进阶之使能内核debugfs:Adsp输出日志(七十九)

简介: CSDN博客专家,专注Android/Linux系统,分享多mic语音方案、音视频、编解码等技术,与大家一起成长! 新书发布:《Android系统多媒体进阶实战》🚀 优质专栏: Audio工程师进阶系列【原创干货持续更新中……】🚀 优质专栏: 多媒体系统工程师系列【原创干货持续更…

string用法总结

1.介绍 string是一个字符串类&#xff0c;和char类型类似&#xff0c;string是动态的&#xff0c;会自动调整大小&#xff0c;节省了不必要的空间。 1.初始化及定义 //头文件 #include<string>//1. string str1; //生成空字符串//2. string str2("123456789"…

C-V2X通信协议

C-V2X&#xff08;Cellular Vehicle to Everything&#xff0c;蜂窝车联网&#xff09;是一种利用蜂窝网络将车辆与一切事物连接的技术&#xff0c;它基于3G/4G/5G等蜂窝网通信技术演进形成&#xff0c;是当前车联网领域的主流技术标准之一。以下是对C-V2X通信协议的详细介绍&a…

UE5 UE4 使用python进行编辑器操作

使用UE 4.25以上版本后&#xff0c;python代码改动相对较少。 如下类库在4.20/21/22等早起版本不适用&#xff0c;建议查询UE的python文档 unreal.EditorAssetLibrary 1.获取当前选中的资源&#xff08;Content中&#xff09; # 获取当前选中的资产selected_assets unreal.E…