Javascript 如何在主干应用程序中刷新页面
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/8901574/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to refresh a page in a backbone application
提问by Zhen
I am using backbone to build my web app.
我正在使用主干来构建我的网络应用程序。
Currently I am facing an issue whereby if I am on the home page, I am unable to refresh the same page by just clicking on the 'home' button again.
目前我面临一个问题,如果我在主页上,我无法通过再次单击“主页”按钮来刷新同一页面。
I believe that this is the limitation provided by backbone (does not reload the page if the same URL is called)
我相信这是主干提供的限制(如果调用相同的 URL,则不会重新加载页面)
Is there any way around this? So that I can trigger a page reload when I click on the home button again i.e. call the same URL again?
有没有办法解决?这样我就可以在我再次点击主页按钮时触发页面重新加载,即再次调用相同的 URL?
采纳答案by Thanh Nguyen
Looking at the backbone.js source, it seems as though this is not possible by default, since it only responds to a url change. And since clicking the same link, you would not trigger a change event.
查看backbone.js 源代码,似乎默认情况下这是不可能的,因为它只响应url 更改。并且由于单击相同的链接,您不会触发更改事件。
Code in Backbone.History:
Backbone.History 中的代码:
$(window).bind('hashchange', this.checkUrl);
You'll need to handle a non-change yourself. Here's what I did:
你需要自己处理一个不变的事情。这是我所做的:
$('.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);
}
});
回答by amiuhle
You're looking for Backbone.history.loadUrl
.
From the Annotated Source:
您正在寻找Backbone.history.loadUrl
. 从注释来源:
Attempt to load the current URL fragment. If a route succeeds with a match, returns
true
. If no defined routes matches the fragment, returnsfalse
.
尝试加载当前 URL 片段。如果路由匹配成功,则返回
true
。如果没有定义的路由与片段匹配,则返回false
。
So, for a simple refresh link, you can add the following event to your Backbone.View
:
因此,对于简单的刷新链接,您可以将以下事件添加到您的Backbone.View
:
events: {
'click a#refresh': function() {
Backbone.history.loadUrl();
return false;
}
}
回答by guya
In case you want to reload the whole page with a desired view. This might make senes for the home button. The advantage will be that it'll refresh the memory.
如果您想使用所需的视图重新加载整个页面。这可能对主页按钮有意义。优点是它会刷新内存。
Go to any route without loading it (without the 'true') and then reload
转到任何路线而不加载它(没有“true”)然后重新加载
Backbone.history.navigate('route/goes/here');
window.location.reload();
回答by Synn
The backbone.history.loadUrl is the solution.
Backbone.history.loadUrl 是解决方案。
The click handling function of your Home button (if the home is the root / of your WebApp) should be:
您的主页按钮的点击处理函数(如果主页是您的 WebApp 的根 / )应该是:
myAppRouter.navigate('');
Backbone.history.loadUrl();
回答by Bas Slagter
I needed to 'refresh' my page on orientation change event because not all of my css media queries for portrait mode where executed correctly by default. This is what I ended up doing:
我需要在方向更改事件上“刷新”我的页面,因为并非我所有的纵向模式的 css 媒体查询都在默认情况下正确执行。这就是我最终做的:
Backbone.history.fragment = null;
Backbone.history.navigate(document.location.hash, true);
Of course, for the completeness of this answer, this was wrapped in some orientation change handling code:
当然,为了这个答案的完整性,这包含在一些方向更改处理代码中:
window.addEventListener('orientationchange', function () {
Backbone.history.fragment = null;
Backbone.history.navigate(document.location.hash, true);
}, false);
回答by user2498689
You could also just make a meaningless change to the url by adding a random number to the end:
您也可以通过在末尾添加一个随机数来对 url 进行无意义的更改:
var url = $(this).attr('href') + '?rand=' + Math.floor(Math.random() * 1000);
Backbone.history.navigate(url, true);
This is especially useful for IE since it will not request new data via an AJAX call if the url has not changed.
这对 IE 尤其有用,因为如果 url 没有改变,它不会通过 AJAX 调用请求新数据。
回答by Sumit Munot
You can easily refresh the page using below approach:
您可以使用以下方法轻松刷新页面:
@win_loc = window.location.toString().replace("#","")
Backbone.history.redirectTo(@win_loc)
回答by Guy
Here's my favorite approach so far:
到目前为止,这是我最喜欢的方法:
if (!Backbone.history.navigate(urlPath, true)) {
Backbone.history.loadUrl();
}
回答by RameshVel
This is not upto backbone. The same works fine in chrome(webkit browsers), but not in firefox. Its a browser behavior
这不是骨干。在 chrome(webkit 浏览器)中同样可以正常工作,但在 Firefox 中则不行。它的浏览器行为
回答by clyfe
The difference between http://localhost.com/and http://localhost.com/#!/is that the second is a link to anchor, it does not load a page, it only looks for the anchor in the current page, and scrolls to it if found. You need to make your link looks like the first one, no "#" close to end.
http://localhost.com/和http://localhost.com/#!/的区别在于,第二个是锚链接,它不加载页面,它只在当前页面中查找锚, 如果找到就滚动到它。你需要让你的链接看起来像第一个,结尾没有“#”。