Пришло время рассмотреть, последний четвертый элемент архитектуры Backbone.js – роутер.
Всем привет! Роутер нужен, для отслеживания изменений маршрутов (routes) c использованием хэш-тегов (#) в url. Вкратце этот процесс называется URL-маршрутизация. Давайте создадим наш первый роутер:
window.App = {
Views: {},
Models: {},
Collections : {},
Router: {}
};
// шаблон
window.template = function(id) {
return _.template( $('#' + id).html() );
};
App.Router = Backbone.Router.extend({
});
new App.Router();Для работы роутера, необходимо подключить History API. Делается это следующей строкой:
Backbone.history.start();Теперь давайте попробуем написать наш первый “роут”. Маршруты описываются в объекте routes, где каждому “роуту” соответствует определенный метод, срабатывающий как только URL измениться:
App.Router = Backbone.Router.extend({
routes: {
'' : 'index'
},
index: function() {
console.log('Всем привет от индексного роута!');
}
});
routes: {
'' : 'index'
},
index: function() {
console.log('Всем привет от индексного роута!');
}
});
Попробуйте в браузере. И как только убедитесь, что ваш первый “роут” сработал, напишите еще один:
App.Router = Backbone.Router.extend({
routes: {
'' : 'index',
'read' : 'read'
},
index: function() {
console.log('Всем привет от индексного роута!');
},
read: function() {
console.log('это роут Read');
}
});Теперь попробуйте поменять URL на sitename#read. Второй маршрут так же сработал.
Источник:loftblog
