为什么触发我的淘汰赛自定义绑定?
-
26-10-2019 - |
题
我的情况很奇怪。基本上,我有两个自定义绑定,用于将DOM元素动画为新值。这些是awidth和Aright,分别为宽度和正确的值动画。
我已经实施了这样的绑定:
<div class='classname' data-bind="aRight: right, aWidth: containerWidth, style: { zIndex: zindex, left: (left() + 'px'), height: (containerHeight() + 'px') }">
...并且自定义绑定看起来像这样:
ko.bindingHandlers.aWidth =
{
update: function (element, valueAccessor, allBindingsAccessor, context)
{
// Get the value accessor
var value = valueAccessor();
// Get the new width and the duration of the animation
var newWidth = ko.utils.unwrapObservable(value);
var duration = 500;
$(element).animate({ width: newWidth }, duration, "swing");
}
};
ko.bindingHandlers.aRight =
{
update: function (element, valueAccessor, allBindingsAccessor, context)
{
// Get the value accessor
var value = valueAccessor();
// Get the new width and the duration of the animation
var newRight = ko.utils.unwrapObservable(value);
var duration = 500;
$(element).animate({ right: newRight }, duration, "swing");
console.log("aRight Called: newRight - " + newRight + ", duration - " + duration);
}
};
因此,当我们更改除了我的两个自定义绑定可观察物(例如zindex)以外的可观察到的其他可观察到的问题时,问题就会出现。
如果我们更改可观察到的Zindex,则该值在DOM中正确更新,但是由于某种原因,我的Aright Binding也会触发!
在我的Aright自定义绑定中,我没有任何引用,因此肯定不会有依赖性?
当我的AWIDTH绑定也触发时,我的界限也会触发,这也有些奇怪!
有人对此有任何想法吗?
非常感谢!
安迪。
更新
这是更新索引的视图模型的一部分,当导致我的Aright自定义绑定到Fire时(顺便说一句,这是非常多的PSUDO代码!):):
var page = function()
{
this.zindex = ko.observable(0);
this.right = ko.observable(0);
// and other observables....
}
var viewModel = function()
{
var pages = ko.oberservableArray();
// populate the pages array etc...
this.someMethod = function()
{
// Do some stuff...
this.anotherMethod();
// Do some other stuff
}
.bind(this);
this.anotherMethod() = function
{
var pageCount = this.pages().length;
for (var pageNum = 0; pageNum < pageCount; pageNum++)
{
var page = this.pages()[pageNum];
page.zindex(/* a different value */); // This is what causes my aRight binding to fire...
}
}
.bind(this);
}
更新
我只是在这里阅读一篇文章: http://groups.google.com/group/knockoutjs/browse_thread/thread/thread/26A3157AE68C7AA5/44C96D1B748F63BB?
说:
此外,如果还触发了相同的数据结合属性中的另一个绑定,则绑定将再次运行其更新功能。
这是否意味着我看到的是,当触发任何其他绑定数据绑定属性时,我的自定义绑定正在触发(碰巧的是,Zindex是我看到的第一个更改的Zindex)?这不是有点奇怪/错吗?
更新
我有一个简单的小提琴,我认为这几乎可以总结我的问题。似乎在相同的数据结合属性上进行任何绑定,因为自定义绑定将导致其更新!
嗯...猜猜我必须通过手动检查我的自定义绑定,以了解该值是否已更改!这不会击败约束力的实际点???
我还在淘汰论坛上发布了一个更精确的问题: http://groups.google.com/group/knockoutjs/browse_thread/thread/d2290d96e333f1d5a
解决方案
目前是设计。当任何绑定射击时,都会触发数据圈中的所有绑定。这是因为它们全部包裹在单个依赖性手术中。在某些情况下,绑定彼此之间具有依赖性(如果选项已更新,则需要运行值以确保其仍然是有效的值)。但是,在某些情况下,这确实会引起问题。
创建自定义绑定有助于减轻这种行为时,您可以使用不同的模式。实际上,您将在“ init”函数中创建自己的依赖性观点,而不是在“更新”函数中定义功能的胆量。看起来像:
ko.bindingHandlers.custBinding= {
init: function(element, valueAccessor) {
ko.dependentObservable({
read: function() {
ko.utils.unwrapObservable(valueAccessor());
alert("custBinding triggered");
},
disposeWhenNodeIsRemoved: element
});
}
};