代码托管:Github和Gitee,国内用户使用Gitee下载速度较快。
系统环境:Win10/Ubuntu,JDK8,maven,node,docker。
依赖服务:Docker,MySQL8,Redis5
一,问题排查
Jeecg技术社区有用户提交一个issue,自定义组件下选择职务失败,点击一次后消失,显示选中状态,再次点击无反应。
复现问题,点击输入框功能失效,此时右边的“选择”按钮工作正常,点击弹出模态选择框。
二,问题修复
找到后台管理页面和对应的自定义控件代码文件:
1,JSelectUserByDep.vue
根据代码,@search搜索事件触发时,将弹出模态选择框。
添加console.log(),测试发现事件没有正确触发。
那么就添加@click事件,点击时触发,正常弹出模态选择框。
2,JSelectBizComponent/index.vue
查看代码,和JSelectUserByDep稍微不同,JSelectBizComponent处理了dropdownVisibleChange事件,注意到代码注释:
Ant Design Vue错误的设置了open样式,导致点击事件失效。
比对“搜索”按钮点击事件,尝试增加this.visible = true,显示Modal选择框,测试功能正常。
三,总结
1,浏览器兼容性
看到问题第一反应可能是浏览器兼容性问题,于是测试了Chrome, Fixfox, Edge,发现都能重现。
前端测试无法兼顾所有浏览器,选择常用的主流浏览器测试验证。
2,前端框架
如果是学习目的,可以尝试一些新出现的开发框架,体验新技术,跟踪发展趋势。
如果是商业项目,通常选择主流的常用框架,比如Ant Design,Vue。
测试通过,提交代码,创建Pull Request。