Я создаю приложение с помощью Backbone и для перехода от шага 1 к шагу 2 использую функцию router.navigate. Теперь он перейдет на следующую страницу и вернется и т. д.
Однако каждый мой шаг будет сохранен в истории, и каждая страница в истории будет посещена после каждого события. Это также будет отображаться в журнале консоли.
Теперь я также использую require.js
Вот мой роутер:
var OF = OF || {};
OF.SubscribeRouter = Backbone.Router.extend({
routes: {
"step/:stepNumber": "goToStep",
"*other": "defaultRoute"
},
goToStep: function(stepNumber) {
switch(stepNumber) {
case "1":
require(['./views/step1],function(Step1) {
OF.step1 = new OF.Step1;
OF.step1.render();
});
break;
case "2":
require(['./views/step2'],function(Step2) {
OF.step2 = new OF.Step2;
OF.step2.render();
});
break;
case "3":
require(['./views/step3'],function(Step3) {
OF.step3 = new OF.Step3;
OF.step3.render();
});
break;
case "4":
require(['./views/step4'],function(Step4) {
OF.step4 = new OF.Step4;
OF.step4.render();
});
break;
case "5":
require(['./views/step5'],function(Step5) {
OF.step5 = new OF.Step5;
OF.step5.render();
});
break;
case "6":
require(['./views/step6'],function(Step6) {
OF.step6 = new OF.Step6;
OF.step6.render();
});
break;
}
},
defaultRoute: function(other) {
//start loading the welcome page
this.goToStep(1);
}
});
Вот мой основной файл, который запустит роутер:
var OF = OF || {};
require.config({
paths: {
underscore: 'vendor/underscore-min',
jquery: 'vendor/jquery-2.0.3',
json2: 'vendor/json2',
backbone: 'vendor/backbone-min',
handlebars: 'vendor/handlebars',
router: 'routers/router'
},
shim: {
'backbone': {
deps: ['underscore', 'jquery', 'json2'],
exports: 'backbone'
},
'handlebars': {
deps: ['jquery', 'json2'],
exports: 'handlebars'
},
'templateReader': {
deps: ['jquery', 'json2', 'handlebars'],
exports: 'templateReader'
},
'router': {
deps: ['jquery', 'json2', 'backbone'],
exports: ''
}
}
});
require(['router'], function(SubscribeRouter) {
// create the application
'use strict';
OF = {
router: new OF.SubscribeRouter(),
};
//start router
Backbone.history.start();
});
И вот представление, которое вызовет событие для «изменения страницы»:
var OF = OF || {};
OF.Step1 = Backbone.View.extend({
el: '#content',
initialize: function() {
console.log("you're in the address view");
},
render: function() {
//save this in that ;)
var that = this;
OF.template.get('step1-step1', function(data) {
//set the source en precompile the template
var htmlSource = $(data).html();
var template = Handlebars.compile(htmlSource);
//fill template with object or ''
var compiled = template(OF);
//now place the completely compiled html into the page
that.$el.html(compiled);
});
},
events: {
"click #next": "nextStep"
},
nextStep: function() {
OF.router.navigate('step/2', {trigger: true});
}
});
Итак, вот что я вижу в своем журнале консоли после нажатия кнопки «Далее»:
- ПОЛУЧИТЬ шаблон-step2.html
теперь возвращаемся:
- ПОЛУЧИТЬ шаблон-step1.html
Так что сейчас вроде все хорошо. Однако теперь, когда я вернулся к шагу 1 и нажимаю «Далее», я ожидаю перехода к шагу 2. К сожалению, я перейду к шагу 3, и вот что я вижу в своем журнале консоли:
- ПОЛУЧИТЬ шаблон-step2.html
- ПОЛУЧИТЬ шаблон-step2.html
- ПОЛУЧИТЬ шаблон-step3.html
Есть ли способ очистить эту историю или предотвратить ее кэширование или что-то еще?
где я могу найти список опций для метода router.navigate?
