我阅读了几篇关于带有示例应用程序的 Backbone.js 的文章,但我找不到关于 Backbone 如何知道何时单击视图中的小部件以及它绑定到哪个模型的解释或示例。
它是通过ID的内部分配处理的吗?
例如,如果您想删除 id="123" 的 div,可以使用 jQuery 或 javascript 函数将其从 DOM 中删除。在主干中,这个 div 可能没有 id,但可以在不知情的情况下被删除,对吧?
如果有人知道一篇好文章或可以提高我对此的理解,那就太好了。
我阅读了几篇关于带有示例应用程序的 Backbone.js 的文章,但我找不到关于 Backbone 如何知道何时单击视图中的小部件以及它绑定到哪个模型的解释或示例。
它是通过ID的内部分配处理的吗?
例如,如果您想删除 id="123" 的 div,可以使用 jQuery 或 javascript 函数将其从 DOM 中删除。在主干中,这个 div 可能没有 id,但可以在不知情的情况下被删除,对吧?
如果有人知道一篇好文章或可以提高我对此的理解,那就太好了。
视图“知道”它所绑定的模型的方式是通过如下所示的 _configure 方法完成的:
_configure: function(options) {
if (this.options) options = _.extend({}, this.options, options);
for (var i = 0, l = viewOptions.length; i < l; i++) {
var attr = viewOptions[i];
if (options[attr]) this[attr] = options[attr];
}
this.options = options;
}
要注意的导入块是:
for (var i = 0, l = viewOptions.length; i < l; i++) {
var attr = viewOptions[i];
if (options[attr]) this[attr] = options[attr];
}
viewOptions 是一个对视图具有“特殊”含义的键数组。这是数组:
var viewOptions = ['model', 'collection', 'el', 'id', 'attributes', 'className', 'tagName'];
这个循环是视图和模型或视图和集合之间的“粘合剂”。如果它们出现在选项中,则会自动分配它们。
所有这些都在带注释的源代码中。
阅读源代码可能是提高理解力的最佳选择。您要查看的 Backbone 函数称为 delegateEvents。但简短的版本是它使用jQuery delegate()函数。根元素是视图的元素(el
属性),它由您提供的任何选择器过滤。
jQuery 实际上并没有将处理程序绑定到您正在收听的每个元素。相反,它让事件冒泡到根元素并在那里检查它们。由于每个单独的元素都没有附加任何内容,因此您可以自由删除它们而不会造成任何问题。然而,一些删除视图元素的方法(例如,通过在父元素上设置innerHTML)可能会导致内存泄漏。我不是 100% 确定这一点,但最好还是不要这样做。
检查http://www.joezimjs.com/javascript/introduction-to-backbone-js-part-1-models-video-tutorial/。
即使它看起来很复杂,也没什么可学的,相信我。
如果您问得更具体,我可以尝试提供帮助。