Question

在淘汰库中启用延迟更新时遇到问题。我已经将Jquery数据表实现为一个组件，当导航到具有该组件的视图时，我可以看到按顺序调用以下方法。 Getview＆GT;激活＆GT;附加

一切都按预期工作

但是，如果我按f5并刷新页面而不是从另一个页面导航到它，它会中断并调用以下方法

Getview＆gt;激活＆gt;附加＆gt; Getview＆gt;激活＆gt;附加＆gt;分离＆gt;分离（不确定为什么它最后被调用两次）并且它打破了，UI上根本没有显示任何表格，因为它不能从我所知道的内容中呈现，我认为它与durandal过渡有关，并且导航到页面和刷新页面有点区别吸管。

这是一个为我复制问题的最小类，注意我没有这个组件的HTML文件我想使用getView方法从JQueryDT传递一些动态HTML

我创建了一个快速示例项目，只需要最少的时间来复制问题。 https://bitbucket.org/dchosking1988/deferred-update-example

如果你拉动并运行它，你会看到＆＃34; hello world＆＃34;刷新页面时会消失，但如果你在标签之间导航则不会。

我用来复制问题的一般步骤是

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>

Answer 1

这是因为它调用代码两次而第二次调用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>

Answer 2

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中保持为空，

Durandal JS淘汰赛推迟更新

2 个答案: