Съдържание
След като определим какво рутер в нашето приложение Backbone.js, трябва да го накараме да слуша за промени в URL адреса, това е, когато нашият потребител поставя стойност със съответния хеш, например, aplicacion.com/#ruta С това, в допълнение към активирането на слушането, потребителят ще може да маркира приложението.Гръбнак.история
Както обяснихме, това е елементът, който кара нашето приложение да започне слушайте за промени в URL адреса, като вземете хешовете, важното в това е, че също така ни помага да можем да направим приложение, което може да има секции, които се съхраняват като маркер или отметка от потребителя, като по този начин се създават секции, които са достъпни директно, без да се налага да преминавате през много проблеми.
Как да използвам?За да използвате Гръбнак.история трябва да го направим, след като дефинираме обекта, който инициализира нашия рутер и за това го правим .start () метод.
Нека видим в следния код как би било това действие:
var myRouter = нов exampleRouter (); Backbone.history.start ();
В този случай имаме a Рутер Наречен exampleRouter която е присвоена на променливата miRouter, както посочихме, след като това действие бъде извършено, е, че използваме .start () метод както виждаме в последния ред на примера.
Ако изпълним следното Рутер В нашия уеб сървър можем да видим как работи това, което обяснихме:
var exampleRouter = Backbone.Router.extend ({маршрути: {"test": "sampleTest", "search /: query / p: page": "searchConsult", "* other": "defaultRoute",}, sampleTest: function () {console.log ("Получихме достъп до теста на рутера");}, searchQuestion: function (query, page) {var page_no = page || 1; console.log ("No page:" + page_no + " от търсенето, което съдържа думата: " + заявка);}, defaultRoute: function (other) {console.log ('Ресурсът:' + other + 'Не съществува');}}); var myRouter = нов exampleRouter (); Backbone.history.start (); Нека видим на следващото изображение как се оказва, когато имаме достъп до пътя за търсене и му предадем параметрите, които искаме:
Метод this.navigate
Този метод ни позволява актуализирайте URL адреса на приложението от метод, това ни помага да избегнем необходимостта от презареждане на страницата и по този начин да не загубим целта на приложение за една страница, детайлът е, че този метод не го кара да премине през рутера, така че трябва да го направим изрично, нека да видим примерите:
1- Без да преминавате през рутер:
viewTask: function (id) {console.log ("Преглед на исканата задача."); this.navigate ("task /" + id + ' / edit'); // актуализираме URL адреса, но не минава през рутера}, 2- С корекцията, която го кара да премине през рутер:
viewTask: function (id) {console.log ("Преглед на исканата задача."); this.navigate ("task /" + id + ' / edit', {trigger: true}); // актуализираме URL адреса, но не минава през рутера}, С това вече постигаме целта от приложението промяна на url и веднага преминете директно през рутера.
В края на този урок видяхме полезността да имаме достъп до нашето приложение чрез приятелски URL адреси, тъй като това ни помага да го направим по -четимо за търсачките и за потребителите, като по този начин подобряваме SEO.Хареса ли ви и помогнахте на този урок?Можете да възнаградите автора, като натиснете този бутон, за да му дадете положителна точка
