如何在主幹應用程序中刷新頁面

Question

我正在使用主幹來構建我的Web應用程序。

目前我正面臨一個問題，如果我在主頁上，我無法通過再次單擊「主頁」按鈕來刷新同一頁面。

我認爲，這是由骨幹提供的限制（不重新加載頁面，如果相同的URL被調用）

有沒有解決這個辦法嗎？這樣，當我再次點擊主頁按鈕時，我可以觸發頁面重新加載，即再次調用相同的URL？

Answer 1

看着backbone.js源代碼，它似乎默認情況下是不可能的，因爲它只響應url更改。而且，由於點擊相同的鏈接，您不會觸發更改事件。

守則Backbone.History：

$(window).bind('hashchange', this.checkUrl); 

你需要處理不改變自己。下面是我所做的：

$('.nav-links').click(function(e) { 
    var newFragment = Backbone.history.getFragment($(this).attr('href')); 
    if (Backbone.history.fragment == newFragment) { 
     // need to null out Backbone.history.fragement because 
     // navigate method will ignore when it is the same as newFragment 
     Backbone.history.fragment = null; 
     Backbone.history.navigate(newFragment, true); 
    } 
}); 

Answer 2

這不是最高的主幹。在Chrome（webkit瀏覽器）中工作正常，但不是在Firefox中。它的瀏覽器行爲

Answer 3

http://localhost.com/和http://localhost.com/#!/之間的區別在於第二個是指向錨點的鏈接，它不加載頁面，它只查找當前頁面中的錨點，如果找到，則滾動到它。你需要讓你的鏈接看起來像第一個，沒有「＃」接近結束。

Answer 4

我需要「刷新」我的頁面上方向變化的活動，因爲不是所有的我的CSS媒體查詢爲其中默認情況下正確執行肖像模式。這是我落得這樣做：

Backbone.history.fragment = null; 
Backbone.history.navigate(document.location.hash, true); 

當然，對於這個答案的完整性，這種被包裹在一些方向變化處理代碼：

window.addEventListener('orientationchange', function() { 
    Backbone.history.fragment = null; 
    Backbone.history.navigate(document.location.hash, true); 
}, false); 

Answer 5

如果要重新加載整個具有所需視圖的頁面。這可能會讓home按鈕變成senes。好處是它會刷新內存。

去任何路由，而不需要加載它（沒有「真」），然後重新加載

Backbone.history.navigate('route/goes/here'); 
window.location.reload(); 

Answer 6

你可以經常修改你的路線，包括圖示，以便您可以追加一個隨機字符串的結束的href使其獨一無二，但仍與「家」路線相匹配。 （注意：讓這是你的最後一條路線。）

在路由：

routes: { 
    "*str": "home" 
} 

在視圖：

render: function() { 
    var data = {href: +(new Date())}; 
    _.extend(data, this.model.attributes); 
    this.$el.html(this.template(data)); 
    return this; 
} 

在這裏所示的模板（把手）：

<a href="{{href}}">Home Link</a> 

Answer 7

你也可以只讓一個毫無意義的變化到URL中加入一個隨機數到最後：

var url = $(this).attr('href') + '?rand=' + Math.floor(Math.random() * 1000); 
Backbone.history.navigate(url, true); 

，因爲它不會通過AJAX調用請求新的數據，如果URL沒有這對於IE特別有用改變。

Answer 8

您正在尋找Backbone.history.loadUrl。 來自Annotated Source：

嘗試加載當前的URL片段。如果路線成功，則返回true。如果沒有定義的路線匹配該片段，則返回false。

因此，對於簡單的刷新鏈接，您可以在下面的事件添加到您的Backbone.View：

events: { 
    'click a#refresh': function() { 
    Backbone.history.loadUrl(); 
    return false; 
    } 
} 

Answer 9

爲了提供的代碼可重用的片斷我增強了Backbone.View與助手方法無論我們需要重新加載相同的頁面，儘管Backbone路由器的限制。

在我們的app.js文件或任何其他合適的地方

Backbone.View = Backbone.View.extend({ 
    refreshPage: function(e){ 
     if(e.target.pathname){ 
      Backbone.history.navigate(e.target.pathname); 
     } 
     window.location.reload();   
    } 
}); 

這樣，如果我們作爲

<a href="/whatever" id="whateverId">Some text </a> 

在我們看來，這樣的鏈接，我們就只需要點擊事件綁定以回調利用刷新頁面功能，只要refreshPage助手將通過原型鏈可用

events: { 
    'click #whateverId': 'refreshPage', 
} 

至於我們不需要改變「標籤」這是一個清晰的解決方案，將節省一些樣板編碼

希望它可以幫助

Answer 10

它與

myBackboneRouter.navigate("users", {trigger: true}) 

Answer 11

你可以使用以下方法輕鬆刷新頁面：

@win_loc = window.location.toString().replace("#","") 
Backbone.history.redirectTo(@win_loc) 

Answer 12

backbone.history.loadUrl是解決方案。

的點擊處理您的主頁按鈕的功能（如果家裏是你的Web應用程序的根目錄/）應該是：

myAppRouter.navigate(''); 
Backbone.history.loadUrl(); 

Answer 13

這裏是我最喜歡的辦法至今：

if (!Backbone.history.navigate(urlPath, true)) { 
     Backbone.history.loadUrl(); 
}