Durandal canDeactivate vs window.onbeforeunload可能的替代方案

用戶可以編輯他們的個人資料信息。如果他們試圖在存在更改時離開頁面，則所需的功能應該是它們帶有確認框。當我使用Durandal的canDeactivate時，只有當我嘗試導航到另一個Durandal頁面時纔會觸發它。當我使用window.onbeforeunload它只是當我硬刷新或鍵入一個新的URL時觸發等。Durandal canDeactivate vs window.onbeforeunload可能的替代方案

是否有任何通用的解決方案（統一的外觀和感覺），可以捕獲這兩類事件，以便防止用戶立即導航離開頁面？

我的兩個方法都顯示如下：

迪朗達爾canDeactivate

canDeactivate: function() { 
     if ($("#saveButtonsBottom").css('visibility') === 'visible') { 
      var title = 'Warning'; 
      var msg = 'Do you want to leave this page and lose all of your edits to this form?'; 
      return app.showMessage(msg, title, ['Yes', 'No']) 
       .then(function (selectedOption) { 
        return selectedOption === 'Yes'; 
       }); 
     } 
     return false; 
    }

window.onbeforeunload

  window.onbeforeunload = function() { 
      if ($("#saveButtonsBottom").css('visibility') === 'visible') { 
       var title = 'Warning'; 
       var msg = 'Do you want to leave this page and lose all of your edits to this form?'; 
       return app.showMessage(msg, title, ['Yes', 'No']) 
        .then(function (selectedOption) { 
         return selectedOption === 'Yes'; 
        }); 
      } 
      return true; 
     };

來源

2014-06-17 Julian

我在，你需要這兩種方法是實踐中發現確定所需的行爲。很多人認爲window.onbeforeunload是Web應用程序的不良做法。

我們最終在我們的Web應用程序中放棄了這種方法，以支持正在進行的工作模式，其中更改每3秒保存一次（到後端）。這樣，用戶就可以自由地從一個頁面移動到另一個頁面，而不用擔心丟失他們的工作。它確實需要調整一個人的數據模型，並且能夠關閉正在進行的作品的驗證。項目文檔集合或項目表（取決於您的數據方法）將具有相應的ProjectDraft文檔集合或表格。

但這是另一個討論的話題。同時，如果你必須採取你提供的方法，爲什麼不把邏輯封裝在另一個需要的模塊中？換句話說：

var onNavigateOrShutdown = function() { 
    var title = 'Warning'; 
    var msg = 'Do you want to leave this page and lose all of your edits to this form?'; 
    return app.showMessage(msg, title, ['Yes', 'No']) 
     .then(function (selectedOption) { 
      return selectedOption === 'Yes'; 
     }); 
}

然後

canDeactivate: function() { 
    if ($("#saveButtonsBottom").css('visibility') === 'visible') { 
     onNavigateOrShutdown(); 
    return false; 
}

和

window.onbeforeunload = function() { 
    if ($("#saveButtonsBottom").css('visibility') === 'visible') { 
     onNavigateOrShutdown(); 
    } 
    return true; 
};

現在，讓我們進入這個功能集成到navigation.manager叫，說一個新的單模塊。然後，只需要在需要該邏輯的任何地方使用該模塊。當然，您可以詳細說明navigation.manager，並讓它包含一個能夠對消息進行響應和/或發佈的集線器。

來源

2014-06-17 16:34:09

Durandal canDeactivate vs window.onbeforeunload可能的替代方案

回答

相關問題