将数据绑定到 Knockout 视图时出现闪烁问题答案

【问题标题】：Flickering Issue while binding data to Knockout View将数据绑定到 Knockout 视图时出现闪烁问题
【发布时间】：2015-11-14 23:47:35
【问题描述】：

我正在开发一个chat application with KO。在binding 聊天对话时，浏览器一直挂起直到绑定，favicon, browser Refresh 和光标按钮是blinking 用于每个消息绑定。

我尝试过制作visible false by default 和制作visible after binding。但它对我不起作用。

这是绑定消息的KO代码

ko.utils.arrayForEach(data, function (item) {
                    var msgobj = new ViewMessagesObject();
                    msgobj.Chattype(item.Chattype);
                    msgobj.contactname(item.contactname);
                    msgobj.contactnum(item.contactnum);
                    msgobj.contactpic(item.contactpic);
                    msgobj.deliverydate(item.deliverydate);
                    msgobj.file(item.file);
                    msgobj.frompic(item.frompic);
                    msgobj.is_delivered(item.is_delivered);
                    msgobj.is_read(item.is_read);
                    msgobj.loader(item.loader);
                    msgobj.message(item.message);
                    msgobj.messageid(item.messageid);
                    msgobj.messgetype(item.messgetype);
                    msgobj.Pic(item.Pic);
                    msgobj.readdate(item.readdate);
                    msgobj.sentdate(item.sentdate);
                    msgobj.sentstatus(item.sentstatus);
                    msgobj.toname(item.toname);
                    msgobj.topic(item.topic);
                    msgobj.uploadopacity(item.uploadopacity);

                    self.DisplayMessageCollection.push(msgobj);
}

我如何stop绑定时出现这些闪烁的问题。

我附上了一个video，它显示了favicon和刷新按钮的闪烁，这样你就可以清楚地理解我的问题。

提前致谢..

Video Demonstrating My Problem

【问题讨论】：

每个消息属性都需要是可观察的吗？ IE。如果消息没有改变，你可以self.DisplayMessageCollection.push(item);
我们已经尝试过了，但是这不起作用:(
我们已经尝试过直接推送每个项目，一次全部推送。但除此之外没有任何效果:(
你能不能试着把所有东西都推到 js 数组中，然后在上面调用valueHasMuated，就像我在这里的回答stackoverflow.com/questions/9709374/… 一样。欢呼
谢谢 sunil.. 会试试这个，让你知道 :)

标签： javascript knockout.js

【解决方案1】：

您发布的视频显示地址栏旁边的 reload 按钮以 chrome 旋转和 favicon 闪烁。

您描述的症状是在以某种方式更改 window.location 时发生的。

这发生在：

导航到一个网址
iframe 被注入到DOM
iframe 的 src 属性发生变化
window.location 对象更改的某些属性

这绝不是导致刷新按钮在chrome浏览器中旋转的详尽列表但您答案中的代码不是原因;这根本不是淘汰赛相关的问题。

此问题的一些可能原因：

您的原始问题中未发布一些与iframes 相关的代码。您的聊天应用程序是否可能使用forever frame technique？
你有一个使用iframes的chrome插件

我希望这可以为您指明解决问题的正确方向。

【讨论】：