ant-design-vue
ant-design-vue copied to clipboard
Date&Range Picker problem
- [ ] I have searched the issues of this repository and believe that this is not a duplicate.
Version
3.1.0
Environment
vue3 vite ts
Reproduction link
https://www.antdv.com/components/date-picker-cn
Steps to reproduce
- 点击RangePicker无法打开面板,以及无法选中日期
- 点击DatePicker可以打开面板,无法选中日期
What is expected?
/
What is actually happening?
- RangePicker无法打开面板,以及无法选中日期
- DatePicker可以打开面板,无法选中日期
- 切换库版本也无法使用
我是打包之后会出现类似的问题,点击输入框无法打开面板,点击图标可以但是选择之后无效。
排查之后发现是"build": "vite build --mode test", 只要是--mode 是test时,DatePicker在打包后都没法使用,改掉test就可以了
test 问题,最新版3.2.10 已经修复了
test 问题,最新版3.2.10 已经修复了
升级到 3.2.10 依旧木有修复,还是用楼上修改 mode 的方式解决了...
升级到 3.2.11 依旧木有修复
奇怪,我也是有这个问题,重新拉了下依赖又没有问题了
mark
同样的问题
同样的问题,在3.2.12版本下用 --mode betaa 构建后也不能打开面板,切回3.2.0版本才可以。
mask
我3.2.0虽然可以了, 但是modal弹窗动画没了
构建时候,NODE_ENV 别使用test就行了。
3.2.13 也有这个问题
mark
3.2.14 版本,本地开发存在这个问题。
目前验证回退到 3.2.5 版本正常。
相关信息:
- 依赖:
- 运行命令:
vite serve --mode test
疑问:vite 的 --mode test
为什么会修改 process.env.NODE_ENV
?
3.2.14 版本,本地开发存在这个问题。
目前验证回退到 3.2.5 版本正常。
相关信息:
依赖:
运行命令:
vite serve --mode test
疑问:vite 的
--mode test
为什么会修改process.env.NODE_ENV
?
找到了原因:
问题1:vite 的 --mode test
为什么会修改 process.env.NODE_ENV
?
原因:运行 vite 时,如果没有设置 process.env.NODE_ENV
,同时参数为 --mode test
时,vite 会将 process.env.NODE_ENV
设置为 test
。
相关源码可以查看: https://github.com/vitejs/vite/blob/2401253b9aa487c50edb5ec571d5ba7adc949e27/packages/vite/src/node/plugins/define.ts#L18-L31
问题2:process.env.NODE_ENV === 'test'
时,点击 RangePicker 输入框为什么不弹出 Picker ?
原因:RangePicker 的 isClickOutside
判断是否在 Input 外点击,而 elementsContains
中 process.env.NODE_ENV === 'test'
判断为 Jest 测试环境,返回 false
,因此不会弹出 Picker。
https://github.com/vueComponent/ant-design-vue/blob/797a1c6c8f6757048bf7356dba935e1a9d0508ed/components/vc-picker/RangePicker.tsx#L628-L632
https://github.com/vueComponent/ant-design-vue/blob/797a1c6c8f6757048bf7356dba935e1a9d0508ed/components/vc-picker/utils/uiUtil.ts#L271-L279
https://github.com/vueComponent/ant-design-vue/blob/797a1c6c8f6757048bf7356dba935e1a9d0508ed/package.json#L38
问题3:为什么 3.2.6 之前版本没有问题?
原因:3.2.6 版本中有一个变更 https://github.com/vueComponent/ant-design-vue/pull/5657/commits/b60abb3d8f04e310b3fa28c35e5dced28c901a77 ,修复了 PickerInput 的事件逻辑。其实在 3.2.6 版本之前,globalMousedownEvent
一直没有绑定对应事件,也就没有执行 isClickOutside
,因此没有暴露出问题而已。
临时解决方案:
- 1、设置
process.env.NODE_ENV
为test
外的其它名称 - 2、如果没有设置
process.env.NODE_ENV
,则--mode
设置为test
外的其它名称
This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days
test 问题,最新版3.2.10 已经修复了 为什么我升级到3.2.10 还是不行呢???????
4.0.8仍然存在这个问题,修改vite build --mode production测试和线上还是没有作用