Как обновить страницу в базовом приложении
Я использую магистраль для создания своего веб-приложения.
В настоящее время я сталкиваюсь с проблемой, когда, если я нахожусь на главной странице, я не могу обновить одну и ту же страницу, просто нажав кнопку "домой".
Я считаю, что это ограничение, предоставляемое магистральной сетью (не перезагружает страницу, если вызывается тот же URL-адрес)
![enter image description here]()
Есть ли способ обойти это? Чтобы я мог инициировать перезагрузку страницы, когда я снова нажимаю кнопку "домой", т.е. Снова вызывает тот же URL-адрес?
Ответы
Ответ 1
Глядя на источник backbone.js, кажется, что это невозможно по умолчанию, поскольку оно реагирует только на изменение URL-адреса. И после нажатия одной и той же ссылки вы не инициируете событие изменения.
Код в Backbone.History:
$(window).bind('hashchange', this.checkUrl);
Вам нужно будет самостоятельно обрабатывать без изменений. Вот что я сделал:
$('.nav-links').click(function(e) {
var newFragment = Backbone.history.getFragment($(this).attr('href'));
if (Backbone.history.fragment == newFragment) {
// need to null out Backbone.history.fragement because
// navigate method will ignore when it is the same as newFragment
Backbone.history.fragment = null;
Backbone.history.navigate(newFragment, true);
}
});
Ответ 2
Вы ищете Backbone.history.loadUrl
.
Из Аннотированного источника:
Попытка загрузить текущий фрагмент URL-адреса. Если маршрут завершается с совпадением, возвращается true
. Если определенные маршруты не совпадают с фрагментом, возвращает false
.
Итак, для простой ссылки обновления вы можете добавить следующее событие в свой Backbone.View
:
events: {
'click a#refresh': function() {
Backbone.history.loadUrl();
return false;
}
}
Ответ 3
Если вы хотите перезагрузить всю страницу с нужным представлением. Это может сделать сены для кнопки "домой". Преимуществом будет то, что он обновит память.
Перейдите на любой маршрут, не загружая его (без "истины" ), а затем перезагрузите
Backbone.history.navigate('route/goes/here');
window.location.reload();
Ответ 4
Backbone.history.loadUrl - это решение.
Функция обработки щелчка кнопки "Домой" (если дом является корнем/вашего WebApp) должен быть:
myAppRouter.navigate('');
Backbone.history.loadUrl();
Ответ 5
Мне нужно было "обновить" мою страницу в событии изменения ориентации, потому что не все мои медиа-запросы css для портретного режима, где выполняется по умолчанию правильно. Это то, что я закончил:
Backbone.history.fragment = null;
Backbone.history.navigate(document.location.hash, true);
Конечно, для полноты этого ответа это было обернуто некоторым кодом обработки ориентации:
window.addEventListener('orientationchange', function () {
Backbone.history.fragment = null;
Backbone.history.navigate(document.location.hash, true);
}, false);
Ответ 6
Вы также можете просто сделать бессмысленное изменение URL-адреса, добавив случайное число в конец:
var url = $(this).attr('href') + '?rand=' + Math.floor(Math.random() * 1000);
Backbone.history.navigate(url, true);
Это особенно полезно для IE, поскольку он не будет запрашивать новые данные через вызов AJAX, если URL-адрес не изменился.
Ответ 7
Вы можете легко обновить страницу, используя подход ниже:
@win_loc = window.location.toString().replace("#","")
Backbone.history.redirectTo(@win_loc)
Ответ 8
Это не все основания. То же самое прекрасно работает в chrome (webkit browser), но не в firefox. Его поведение браузера
Ответ 9
Разница между http://localhost.com/ и http://localhost.com/#!/ заключается в том, что вторая является ссылкой на привязку, она не загружает страницу, она ищет только привязку на текущей странице и прокручивается до нее, если она найдена. Вам нужно, чтобы ваша ссылка выглядела как первая, без "#" близко к концу.
Ответ 10
Вы часто можете изменить свой маршрут, чтобы включить splat, чтобы вы могли добавить случайную строку в конец href, чтобы сделать ее уникальной, но по-прежнему соответствовать "домашнему" маршруту. (Примечание: сделайте этот последний маршрут.)
В маршрутах:
routes: {
"*str": "home"
}
В представлении:
render: function() {
var data = {href: +(new Date())};
_.extend(data, this.model.attributes);
this.$el.html(this.template(data));
return this;
}
В шаблоне (здесь показаны рули):
<a href="{{href}}">Home Link</a>
Ответ 11
Чтобы предоставить многократно используемый фрагмент кода, я добавил Backbone.View с помощью вспомогательного метода для повторного использования его везде, где нам нужно перезагрузить одну и ту же страницу, несмотря на ограничения маршрутизатора Backbone.
В нашем файле app.js или в любом другом месте
Backbone.View = Backbone.View.extend({
refreshPage: function(e){
if(e.target.pathname){
Backbone.history.navigate(e.target.pathname);
}
window.location.reload();
}
});
Таким образом, если у нас есть ссылка, такая как
<a href="/whatever" id="whateverId">Some text </a>
В нашем представлении нам просто нужно связать событие click с этим обратным вызовом, чтобы использовать функцию страницы обновления, поскольку помощник refreshPage будет доступен через цепочку прототипов.
events: {
'click #whateverId': 'refreshPage',
}
Насколько нам не нужно менять "тег", это более чистое решение, которое сэкономит некоторое кодированное кодирование
Надеюсь, что это поможет
Ответ 12
Он работает с
myBackboneRouter.navigate("users", {trigger: true})
Ответ 13
Вот мой любимый подход:
if (!Backbone.history.navigate(urlPath, true)) {
Backbone.history.loadUrl();
}