如何使用 hasher.js 和 crossroads.js 重新加載路線？

Question

我目前有這個代碼：

crossroads.addRoute('/login', function(){
    $.ajax({
        url: '/login',
        type: 'GET',
        data: {

        },
        success: function(msg) {
            $('#' + main_window).html(msg);
        }
    })
});

連同這個用於維護歷史的 hasher.js：

function parseHash(newHash, oldHash){
    crossroads.parse(newHash);
}
hasher.initialized.add(parseHash); //parse initial hash
hasher.changed.add(parseHash); //parse hash changes
hasher.init(); //start listening for history change

$('a').on('click', function(e) {
    e.preventDefault();
    hasher.setHash($(this).attr('href'));
});

現在，當我有一個顯示 #/login 的鏈接並單擊它時，登錄頁面加載正常。 但是，如果用戶再次單擊登錄鏈接，頁面不會重新加載。 我知道點擊正在注冊，但路由/散列沒有觸發。 我該如何做到這一點？

任何幫助將不勝感激。 謝謝！

Answer 1

您沒有使用hasher.setHash("#/currentpage")更改任何內容，因為您已經在該頁面上。 所以改變事件永遠不會被解雇。 你可能只是去：

$('a').on('click', function(e) {
    e.preventDefault();
    hasher.setHash('');
    hasher.setHash($(this).attr('href'));
});

但這會使歷史變得混亂，因此如果您使加載方法可用，您可以強制重新加載點擊：

var loadLogin = function(){
    $.ajax({
        .... your ajax settings ....
    });
};
crossroads.addRoute('/login', loadLogin);

$('a').on('click', function(e) {
    e.preventDefault();
    var newHash = $(this).attr('href');
    if(newHash === '/login' && hasher.getHash() === '/login') {
        loadLogin()
    } else {
        hasher.setHash(newHash);
    }
});

---

編輯正如@Patchesoft指出的那樣，十字路口有一個名為ignoreState的屬性，它會強制任何請求通過路由器功能，即使在當前頁面上 - https://millermedeiros.github.io/crossroads.js/#crossroads- ignoreState

Answer 2

您可以通過以下方式強制調用您的路線：

// add this dummy route first
crossroads.addRoute('noop', function() { } );

$('a').on('click', function(e) {
// route to dummy route
hasher.setHash('noop');
// and then replace by your login route
hasher.replaceHash('login');
}