当前位置: 首页 > 工具软件 > CanJS > 使用案例 >

CanJS小试

苏嘉志
2023-12-01

最近做了个不太复杂的console项目,基本上就是增删改查外加上传文件。

计划用JS的MVC框架来做,粗略了解了一下Ember,CanJS,BackBone这三个,选择了貌似比较轻的CanJS。

 

整体情况还比较顺利,但是由于官网文档的不友好,还是遇到了一些麻烦。

 

1,Model 的 findAll对应的API的返回结果只能是 [{}, {}] 或 {data:[{},{}], start:1, len: 10}。如果是后一种,那么前端接收到的结果实际上是个类数组对象,本身包含了data中的项,以及属性start和len,但是没有data属性了。

还有,len不能为length,会使页面模板中的list 等遍历方法出错。

2,提供了绑定,但是只能改变之前绑定的变量的属性值来实现数据刷新。比如,之前绑定了curData变量,那么需要将newData的各个属性值赋给curData。另一个前提是在模板中用obj.attr()方法来获取属性值,而不是.(点号)。

3,Model的5个方法非常死,必须使用那5个名字:findAll, findOne, create, update, destroy,否则不工作。如果findAll的返回结果是对象,并且嵌套太多,那么结果会比较奇怪。

 

官方文档很多东西说的并不明确,toturial组织上也有点混乱,看起来云里雾里的。

因为项目不复杂,用到的部分也就是Model的api访问;Control的init初始化模板以及自定义事件处理方法; 还有模板渲染。在后台API出来之前,用了一下fixture做模拟。其实对于逻辑不复杂的项目来说,完全可以在jQuery的基础上写几个方法搞定MVC。

如果canjs的文档和Tutorial能像Ember的那样,开发速度应该会快很多,也许也可以用上更多的特性。

 

下次有机会会尝试一下backbone、Angular以及复杂庞大的Ember。

 

P.S.  在使用uploadify的时候发现了一个jQuery在IE浏览器上的bug:当使用jQuery的ele.html()方法时,jQuery会先清空ele当前的每个子元素;为了防止内存泄露,在清空之前,会调用acceptData方法判断该元素是否可扩展以决定是否清空其data。acceptData()原注释为“A method for determining if a DOM node can handle the data expando”。于是,如果子元素为flash对象,即object标签,那么在IE中会报错,找不到对象,实际上是hasAttribute这个方法不存在。

见:http://bugs.jquery.com/ticket/9560

这个错误两年前就在jQuery的bug系统里有了,似乎不了了之。

 

我的解决方法是,将Query 1.10.2版本的源码中的3791行:

return !noData || noData !== true && elem.getAttribute("classid") === noData;

改为:

return !noData || noData !== true && (elem.getAttribute && elem.getAttribute("classid") === noData);

 类似资料: