extjs踩坑记录

项目结构

• 前端
  ExtJS 4.2.1
• 后台
  Spring MVC 3.2.8 + Hibernate 4.1.7
• 数据库
  SQL Server

模块

• View层由ExtJS自己的MVC构成
  -- Model用来承载后端传输来的数据
  -- Store相当于代理，实际工作由后端的Controller完成
  -- View就是实际的视图(本项目中只有两个页面:登陆页面,主页面.类似于后台管理界面)

• Model层和Controller层由Spring MVC 构成
  -- Controller 用来处理请求，这里只用来传输数据，不做视图转发

  
  
  

  环境项目结构

以我现在的了解，这个项目采用的是一个特殊的"MVC"结构，Spring MVC是核心组件，交互过程如下图

交互过程

交互过程

1. 前台点击触发事件，通过store发送请求
2. 根据请求地址，Spring MVC Controller开始处理请求，在这里进行查询参数设置(最终将这些参数附加到一个model上，通过它进行查询)、model对象的修改、添加、删除以及逻辑关系处理
3. Controller使用Service层进行真正的数据操作，而Service又是对DAO层的一个封装，随意最终数据操作都是在DAO层完成。
4. DAO层中进行sql语句查询，使用上面传来的model对象，抽取其中的参数设置查询参数并将查询到的结果封装成model组返回。(Hibernate在这里起作用)

需求

还是挺复杂的，我参加时已经要开始三期了，表都有近百张，整个项目的结构已经确定了,这次给我分配给我一个任务，业务逻辑是这样：

用户点击退货菜单，显示退货界面，新增行，点击材料编号，弹出材料查询界面，用户选定一条记录后，关闭弹出页面，自动填写其他字段。用户输入退货数量后，点击保存，完成退货操作。
用户点击退货报表，显示退货报表界面，可通过组合查询筛选结果。

这里最复杂的地方是材料查询页面，因为是退货，只有入库之后的材料才需要显示，而有些材料根本就没有入过库。所以需要设置查询，根据两个表的关系，做的查询语句的大概内容是：

select cl.no,cl.name........
from cailiao as cl
right join
(select rk.cailiaono as cailiaono,sum(rk.volume)
from ruku
group by rk.cailiaono) as rkcl
on cl.no=rkcl.cailiaono
where 1=1 and...查询参数

表关系.jpg

根据这个关系，在DAO、Service、Controller中添加相应的方法，这虽然逻辑复杂一点，但是确定之后就很好弄了，坑爹的在ExtJS上

血泪史

• 前两天
  开发用的myeclipse，tmd对js的支持基本为0，就因为错别字折腾两天(尝试用过外部编辑器，尴尬的是在外部编辑后必须在myeclipse中打开才会更新)
• 中间几天
  被复杂的页面结构搞晕，已经有点慌，开始乱写了，莫名其妙能跑了，结果一起检查发现逻辑搞错了，改吧！
• 又是几天
  这下彻底慌了，乱上加乱，写到自己也不知道在写什么
• 最后两天
  意识到错误，询问延期两天影响如何，承认错误。重写，两天后完成。

ExtJS 的坑

1. 报错提示
   别人家的报错是这样的

   
   
   

   JQuery报错

ExtJS的报错是这样的，错误原因就是缺了个标点，这去哪找去（绝望），这报错信息一点用都没有

ExtJS报错

2. 莫名其表的错误
   因为是根据之前的页面写的新页面，再三检查之后，根本没问题，这里就是会报错(不影响逻辑和执行)

   
   
   

   image.png
3. 竟然没了。。看来最大的坑就是报错机制了，从中找不到任何有用的信息

---

这个项目的总体架构挺好，以我的认知，要是有单元测试就好了，现在的冗余代码特别多，但是不敢改，稍微一改就会有问题。

---

了解还太少，如有错误请指正