1

我正在研究 KnockoutJS,它看起来真的很棒,但我不太喜欢动画的实现方式。

所以,我的问题是,在一个动画密集型应用程序中,我应该使用淘汰赛吗?是否有首选的、有组织的动画处理方式?

在我看来,它要么是 DOM 地狱,要么是两者的轻微混合。我读了这篇文章,几段代码,主要是下一段,在我看来已经有点乱了:

<ol data-bind="foreach: queuedPhotos">
    <li data-bind="attr: { 'data-id' : queuedPhotoId }, click: select, css: { selected: $root.selectedPhoto() !== undefined && $root.selectedPhoto().queuedPhotoId() === queuedPhotoId() }">
        <img src="img/cross.png" alt="Remove" title="Remove" class="remove" data-bind="click: remove" />
        <img data-bind="attr: { 'src' : smallImageUrl, 'alt' : title, title: title }" />
    </li>
</ol>
4

2 回答 2

3

Knockout 是一个用于绑定数据和操作 dom 的优秀库。至于你提到的绑定语法地狱,如果你有很多功能交给一个元素,最终会爬起来。即使是像可见绑定这样简单的事情,也可以看到使用超过 4 或 5 个值来显示或隐藏。这就是说,典型的方法是创建一个自定义绑定处理程序来清理它或使用不显眼的绑定,这是 Ryan Niemeyer 在他的博客http://www.knockmeout.net/2011/08/simplifying-and-cleaning中谈到的-up-views-in.html

有多种技术(knockmeout.net 是一个很好的资源,请查看他的演示文稿中有关不显眼的绑定的一些视频)。

总而言之,动画并不是 Knockout 固有的功能。它将实现留给开发人员。无论是使用 jQuery 来实现,还是使用 d3.js 或 Raphael 来管理画布动画,还是已经存在的数千种动画,完全取决于您。

保持你的视图模型简单(复杂的逻辑不是我的意思,简单的意思是,它有一个特定的功能并且没有在 1 中做无数的事情),保持你的视图简单并将繁重的工作转移到自定义绑定处理程序或其他一些库.

希望有帮助。

于 2013-04-29T20:03:36.057 回答
0

使用计算的 observables,你应该只对元数据使用 data-bind 属性,比如

data-bind="enable: canSave"

不是

data-bind="enable: errors().length == 0"

还有一些库可以删除或最小化数据绑定属性的使用,我已经制作了一个使用约定优于配置的库,在这里查看

https://github.com/AndersMalmgren/Knockout.BindingConventions

用我的lib这行代码

<button data-bind="click: save, enable: canSave"></button>

将会

<button data-name="save"></button>

http://jsfiddle.net/3Ajnj/

于 2013-04-30T06:54:18.843 回答