CanJS小试

最近做了个不太复杂的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);