我有一个以下列方式调用一系列加载请求的路由:
this
.load('/url/to/template.html')
.then(function(html) {
})
.load('/url/to/partial/template.html')
.then(function(html) {
})
.load('/url/to/partial/template.html')
.then(function(html) {
})
.load('/url/to/json', {json: true})
.then(function(data){
});
如果我切换到另一条路线,有没有办法中止这些请求?
答案 0 :(得分:0)
不幸的是,如果切换到另一条路线,Sammy无法中止异步请求。您可以做的最好的事情是在异步请求返回回调后中止处理由异步请求加载的数据。我将如何使用全局对象,这将允许您检查自您开始运行代码后它是否已更改。它看起来像这样:
window.currentRoute = null;
Sammy.get('#/some/path/here', function() {
// This should be an object because that way we can take advantage of
// Reference Type equality. However, it doesn't matter what is put in
// here, and could easily just be "new Object()".
var localCurrentRoute = {
'currentPath': '#/some/path/here'
};
// If you don't always want to override the current route, put some logic
// before this assignment.
window.currentRoute = localCurrentRoute;
this.load('/url/to/template.html').then(function(html) {
// Check if the route is the same object as what we started with, and
// if not, abort further processing of this resource.
if(window.currentRoute !== localCurrentRoute) {
return;
}
// ... do stuff here
});
});
使用此代码,无论何时加载新路由,都应该更改全局指向的对象。使用引用类型相等,如果路由不是我们开始的路径,我们知道路由在我们下面发生了变化,而async load()。then()方法将不会进一步处理它们的数据。这解决了异步加载的大多数问题(即它下面的上下文正在发生变化),然而,我发现它通常足以满足大多数目的。
但是,这并不会停止加载数据,默认情况下无法使用Sammy。如果您有特别长的运行请求,您可能会查看备用异步库,并且必须修改上面的代码以存储对每个加载新路由时中止的异步调用的引用。我将把它作为练习让读者去处理他们喜欢的图书馆。
答案 1 :(得分:0)
没有内置选项,但我做了一些解决方法。 在 sammy.js :
(function ($) {
var Sammy,
currentXhr = null //Added this var
....
// added this method to abort ajax call
abort: function () {
if (currentXhr) {
currentXhr.abort();
currentXhr = null;
}
},
load: function (location, options, callback) {
var context = this;
return this.then(function () {
....
this.wait();
//abort any current call
this.abort(); //Added this row
currentXhr = $.ajax($.extend({ //added 'currentXhr ='
...