我正在使用控制器获取URL。我需要一种在POST中放入Parameter的方法。这些参数由用户在View&尚未存储(我不知道如何存储)
目前我设法做到
- 显示&使用来自API的搜索结果路由视图
- 当有人选择筛选选项时显示并刷新页面
问题
- 我不知道如何记录用户点击的内容
- 如何"重新发布"以便获得新的结果
- 我读到有人说POST Fetch应该在Model中完成,收藏是为商店多个模型,我在这里不知道场景
集合Jobs.js
define([
'jquery',
'underscore',
'backbone',
'models/filter'
], function($, _, Backbone,JobListFilterModel){
var Jobs = Backbone.Collection.extend({
url: function () {
return 'http://punchgag.com/api/jobs?page='+this.page+''
},
page: 1,
model: JobListFilterModel
});
return Jobs;
});
集合过滤器.JS
define([
'jquery',
'underscore',
'backbone',
'models/filter'
], function($, _, Backbone,JobListFilterModel){
console.log("Loaded");
var Jobs = Backbone.Collection.extend({
url: function () {
return 'http://punchgag.com/api/jobs?page='+this.page+''
},
page: 1,
model: JobListFilterModel
});
// var donuts = new JobListFilterModel;
// console.log(donuts.get("E"));
return Jobs;
});
型号过滤器.js
define([
'underscore',
'backbone'
], function(_, Backbone){
var JobFilterModel = Backbone.Model.extend({
defaults: {
T: '1', //Task / Event-based
PT: '1', //Part-time
C: '1', //Contract
I: '1' //Internship
}
});
// Return the model for the module
return JobFilterModel;
});
型号Job.js
define([
'underscore',
'backbone'
], function(_, Backbone){
var JobModel = Backbone.Model.extend({
defaults: {
name: "Harry Potter"
}
});
// Return the model for the module
return JobModel;
});
Router.js
define([
'jquery',
'underscore',
'backbone',
'views/jobs/list',
'views/jobs/filter'
], function($, _, Backbone, JobListView, JobListFilterView){
var AppRouter = Backbone.Router.extend({
routes: {
// Define some URL routes
'seeker/jobs': 'showJobs',
'*actions': 'defaultAction'
},
initialize: function(attr)
{
Backbone.history.start({pushState: true, root: "/"})
},
showJobs: function()
{
var view = new JobListView();
view.$el.appendTo('#bbJobList');
view.render();
console.log(view);
var jobListFilterView = new JobListFilterView();
jobListFilterView.render()
},
defaultAction: function(actions)
{
console.info('defaultAction Route');
console.log('No route:', actions);
}
});
var initialize = function(){
console.log('Router Initialized');// <- To e sure yout initialize method is called
var app_router = new AppRouter();
};
return {
initialize: initialize
};
});
一些例子会很棒。感谢
Fetching意味着检索(正如您可能知道的),从服务器获取一些信息。
POST通常用于创建新资源。例如,保存一个新作业将是在类似REST的API中的/jobs URL上进行POST。
在你的情况下,你可能想要的是:
- JobCollection,它将从Backbone Collection扩展并使用JobModel作为模型
- 表示作业的JobModel
您当前已经有JobModel,但它没有集合。。。相反,你有一个JobFilters集合,这意味着你要处理多组过滤器。这可能不是你想的?
假设你现在有一个JobCollection,它表示你的视图将显示的所有作业的列表,当你对它执行collection.fetch()时,它将获得所有作业,而不需要任何过滤器。
现在的问题是:如何将额外的参数传递给集合中的fetch()?
有很多方法可以做到这一点。由于你已经有了一个JobFilterModel,你可以在你的JobFilterModel中实现一个方法,比如:
//jobCollection being the instance of Job collection you want to refresh
refreshJobs: function(jobCollection) {
jobCollection.fetch({reset: true, data: this.toJSON()});
}
模型的toJSON将把模型转换成一个漂亮的Javascript对象。因此,对于您的JobFilterModel,toJSON()将返回类似以下内容:
{
T: '1', //Task / Event-based
PT: '1', //Part-time
C: '1', //Contract
I: '1' //Internship
}
将它放在Collection的fetch()选项散列的数据属性中,会将这些数据添加到服务器的查询中。然后,无论服务器回答的作业是什么,它们都将用于重置作业集合(这就是重置的原因:在选项中为true,否则它只会更新)。然后,您可以在视图中绑定jobCollection"重置"事件,以了解何时重新渲染。
所以,现在,你的JobFilterModel唯一的"作业"是将用户选择的过滤器存储(在内存中),而JobCollection和JobModel对过滤器一无所知(他们不应该知道)。至于存储JobFilterModel的当前状态,您可以查看Backbone本地存储插件,或者将其保存在服务器上/从服务器获取(使用模型的fetch()和save()方法)。
我希望这能有所帮助!