惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Last Week in AI
Last Week in AI
阮一峰的网络日志
阮一峰的网络日志
P
Proofpoint News Feed
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
MongoDB | Blog
MongoDB | Blog
云风的 BLOG
云风的 BLOG
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
J
Java Code Geeks
WordPress大学
WordPress大学
T
The Blog of Author Tim Ferriss
V
Visual Studio Blog
小众软件
小众软件
Microsoft Azure Blog
Microsoft Azure Blog
博客园_首页
IT之家
IT之家
Vercel News
Vercel News
C
Check Point Blog
Google DeepMind News
Google DeepMind News
月光博客
月光博客
D
DataBreaches.Net
酷 壳 – CoolShell
酷 壳 – CoolShell
美团技术团队
Y
Y Combinator Blog
Hugging Face - Blog
Hugging Face - Blog

博客园 - MadGoat

反序列化对象时处理package和serialVersionUID不一致 右键刷新弹出网页广告的解决办法 我的黑莓电子书阅读解决方案 我的BB8700的新伙伴-JABRA BT135蓝牙耳机 XP系统无法出现关机界面的解决一例 关于WINDOWS XP登陆的几个技巧 - MadGoat - 博客园 教你建一个别人打不开的文件夹 开始菜单只剩下经典模式了 任务栏无任务显示的问题 [转载]淮北方言集锦 七八十年代人儿时的玩具 浏览网页右键快速保存内容的小脚本 TatuGIS 破解笔记 NativeExcel 破解笔记 - MadGoat - 博客园 可恶的硬件故障(已解决) 推荐大学自习室后的《再见大四》 美国独立电影人制作的纪录片《南京梦魇——南京大屠杀》 再次推荐SQLPrompt3 -简单破解无限期的使用这款很不错的SQL查询分析工具 用户中心 - 博客园
修改ant-degisn-vue源码实现月范围开始结束可选同一个月
MadGoat · 2020-02-16 · via 博客园 - MadGoat

很多年没更新了

突然想起来,随便写点啥吧.这场新冠肺炎,影响太大了……

记录下最近用vue+antdv ant-degisn-vue 时,日期控件的一个小问题,官方还总是不更新修改,自己动下手,记录下

日期控件选择日期范围时,月模式,选择x月到y月,进入不能允许选择同一个月.

修改月可选择同月

 1 //文件:RangePicker.js
 2 
 3 //位置:node_modules/ant-design-vue/es/date-picker/RangePicker.js
 4 
 5  
 6 
 7 function getShowDateFromValue(value) {
 8 
 9  
10 
11  return [start, end];//by madgoat
12 
13   // var newEnd = end && end.isSame(start, 'month') ? end.clone().add(1, 'month') : end;
14 
15   // return [start, newEnd];
16 
17  
18 
19  
20 
21 //文件:RangeCalendar.js
22 
23 //位置:node_modules/ant-design-vue/es/vc-calendar/src/RangeCalendar.js
24 
25  
26 
27     disabledStartMonth: function disabledStartMonth(month) {
28 
29       var sValue = this.sValue;
30 
31       //by madgoat
32 
33       return month.isAfter(sValue[1], 'month');
34 
35       // return month.isSameOrAfter(sValue[1], 'month');
36 
37     },
38 
39     disabledEndMonth: function disabledEndMonth(month) {
40 
41       var sValue = this.sValue;
42 
43       return month.isBefore(sValue[0], 'month');
44 
45       //by madgoat
46 
47       // return month.isSameOrBefore(sValue[0], 'month');
48 
49     }
50 
51  
52 
53 function getValueFromSelectedValue(selectedValue) {
54 
55   var _selectedValue = _slicedToArray(selectedValue, 2),
56 
57       start = _selectedValue[0],
58 
59       end = _selectedValue[1];
60 
61  
62 
63   return [start, end]; // by madgoat

这样修改完成后,功能是ok了,可是没法提交,而且再次install后,就被覆盖了.

使用patch-package生成一个补丁,install时自动patch,这样就可以提交贡献给小伙伴了.

- 安装patch-package

patch-package包可以通过npm进行安装。

npm i patch-package --save-dev

或者也可以通过yarn进行安装。

yarn add --dev patch-package postinstall-postinstall

- 创建补丁

在修改依赖包内容后,就可以运行patch-package创建patch文件了。

$ npx patch-package package-name # 使用npm
$ yarn patch-package package-name # 使用yarn
运行后通常会在项目根目录下的patches目录中创建一个名为package-name+version.patch的文件。将该patch文件提交至版本控制中,即可在之后应用该补丁了。

- 部署

完成上述操作后,最后还需要修改package.json的内容,在scripts中加入"postinstall": "patch-package"。

"scripts": {
"postinstall": "patch-package"
}
至此,在后续运行npm install或是yarn命令时,便会自动为依赖包打上我们编写的补丁了。

难得更新一次,在家里宅的时间太久,好想打球🏀