在淘汰库中启用延迟更新时遇到问题。我已经将Jquery数据表实现为一个组件,当导航到具有该组件的视图时,我可以看到按顺序调用以下方法。 Getview>激活>附加
一切都按预期工作
但是,如果我按f5并刷新页面而不是从另一个页面导航到它,它会中断并调用以下方法
Getview>激活>附加> Getview>激活>附加>分离>分离(不确定为什么它最后被调用两次) 并且它打破了,UI上根本没有显示任何表格,因为它不能从我所知道的内容中呈现,我认为它与durandal过渡有关,并且导航到页面和刷新页面有点区别吸管。
这是一个为我复制问题的最小类,注意我没有这个组件的HTML文件我想使用getView方法从JQueryDT传递一些动态HTML
我创建了一个快速示例项目,只需要最少的时间来复制问题。 https://bitbucket.org/dchosking1988/deferred-update-example
如果你拉动并运行它,你会看到" hello world"刷新页面时会消失,但如果你在标签之间导航则不会。
我用来复制问题的一般步骤是
1)下载示例项目
2)添加测试组件(请参阅上面的repo以获取示例文件)
3)启用延期更新
4)禁用视图缓存
4)尝试撰写组件的新实例
编辑以提供更多信息
*这不是JQuery Datatable问题,它使用以下内容进行复制
所以你不必下载gitRepo,这是我可以按照上述步骤在示例项目中复制问题的代码。
define([],
function () {
var test = function () {
var self = this;
var defaultViewHtml = '<div> <h1>Hello World</h1></div>';
var currentView = null;
self.getView = function () {
console.log('GetView');
if (!currentView) {
currentView = $(defaultViewHtml)[0];
}
return currentView;
};
self.activate = function (activateOptions) {
console.log('Activate');
};
self.attached = function (view, parent, settings) {
console.log('Attatched');
};
self.detached = function (view, parent) {
console.log('Detatched');
};
};
return test;
});
然后将此HTML添加到index.html,也不要忘记在index.js中创建该类的实例
<div class="whiteRow">
<div class="container">
<div class="row">
<div class="col-md-12">
<div data-bind="compose: { model: test }"></div>
</div>
</div>
</div>
</div>
答案 0 :(得分:4)
这是因为它调用代码两次而第二次调用currentView在test.js中保持为空,我评论了你设置currentView和代码工作的延伸。
self.getView = function () {
console.log('GetView');
//if (!currentView) {
// currentView = $(defaultViewHtml)[0];
//}
return currentView;
};
-
<div class="whiteRow">
<div class="container">
<div class="row">
<div class="col-md-12">
<div data-bind="compose: { model: test }"></div>
</div>
</div>
</div>
</div>
答案 1 :(得分:1)
define([],
function () {
var test = function () {
var self = this;
var defaultViewHtml = '<div> <h1>Hello World</h1></div>';
var currentView = null;
self.getView = function () {
console.log('GetView');
return currentView;
};
self.activate = function (activateOptions) {
console.log('Activate');
};
self.attached = function (view, parent, settings) {
console.log('Attatched');
};
self.detached = function (view, parent) {
console.log('Detatched');
};
};
return test;
});
currentView在test.js中保持为空,