事情是这样的:
在 vite + vue3 + typescript + ant-design-vue 技术栈的项目中,使用 Modal.confirm() 打开一个询问弹框,发现点击取消按钮无效,就直接把文档源码搬过来,发现也无效,开始了排查问题之路。
网上各种说是因为 vue 版本和 ant-design-vue 版本不兼容,vue 必须在 3.4 以下,而我 package.json 中声明的 vue 是 ^3.2.25 版本,我寻思我是 3.2.25 也没有是 3.4.x 呀。
后来我翻了翻 package-lock.json 发现一件大事,这里面确实有 3.4.x 版本的 vue,百度来百度去,最后锁定如下两个知识点:
- 版本号以
^开头,如:^3.2.25表示会安装符合当前大版本的最新版本,也就是只要是3.x就可以,所以最新版是3.4.x - 版本号以
~开头,如:~3.2.25表示会安装符合当前小版本的最新版本,也就是只要是3.2.x就可以
我这里需要锁定他是 3.2.25,直接不加任何符号。
当我安装依赖时,又开始报错,我的 pinia 是 ^2.0.30 版本,根据报错指引,发现该版本的 pinia 依赖于 vue 的 2.6.x 或者 3.3.0,我这里是 vue3 项目,所以将 vue 版本锁定在 3.3.0。
然后再次安装依赖 npm install,没有报错了,package-lock.json 中的 vue 版本也是 3.3.0,ant-design-vue 的 Modal.confirm() 方法也可以成功关闭了。