У меня проблемы с мобильным приложением Backbone, RequireJS & jQuery. Когда я использую вид формы 2 раза, событие отправки формы запускается дважды. Каждое новое представление добавляется к телу, и предыдущее представление будет удалено. Для этого я использую этот код в файле app.js:
$(document).on("mobileinit", function () {
$.mobile.linkBindingEnabled = false;
$.mobile.hashListeningEnabled = false;
$(document).on('pagehide', 'div[data-role="page"]', function (event, ui) {
$(event.currentTarget).remove();
});
})
Router.js
define([
'jquery',
'backbone',
'views/projects/ProjectsView',
'views/projects/AddProjectView'
], function($, Backbone, ProjectsView, AddProjectView) {
return Backbone.Router.extend({
routes: {
'addProject': 'addProject',
'editProject/:projectId': 'editProject',
'*actions': 'showProjects' // Default
},
addProject: function() {
new AddProjectView().render();
},
editProject: function(projectId) {
require([
"views/projects/EditProjectView",
"collections/ProjectsCollection",
"models/ProjectModel"
], function (EditProjectView, ProjectsCollection, ProjectModel) {
var projectsCollection = new ProjectsCollection();
projectsCollection.fetch();
var project = projectsCollection.get(projectId);
if (project) {
var view = new EditProjectView({model: project, projectsCollection: projectsCollection});
view.render();
}
});
},
showProjects: function() {
new ProjectsView().navigate();
}
});
});
Я загрузил свой код в каталог на своем веб-сайте: http://rickdoorakkers.nl/np2. Если вы выполните следующие шаги, вы увидите проблему:
Есть ли кто-нибудь, кто может сказать мне, что я делаю неправильно?
Благодарю!
Ридо, ваш код действительно трудно читать для меня из-за того, как он смешивает несколько вещей и не следует каким-либо обычным соглашениям для Backbone.
Для вашей конкретной проблемы у меня возникло ощущение, что вы привязываете как Edit, так и New view к телу (el: body), как реагируете на событие submit, так и вы никогда не очищаете взгляды, поэтому я подумайте, что всякий раз, когда вы добавляете проект, а затем редактируете его, представление добавления все еще находится в памяти, все еще привязанное к событию отправки и по-прежнему отвечающее на вызов = новый проект с новым именем вместо редактирования.
"Легко" исправлять грязным способом, добавляя вызов stopListening после добавления, но реальная проблема заключается в том, что вы привязываетесь к телу и смешиваете соединения с Backbone Router и ручным хеш-контролем + другие странные шаблоны, такие как выборка сбор каждые 5 строк (вы могли бы просто создать его в начале приложения и всегда использовать его! вот он localstorage, так что это не имеет значения, но если вы когда-нибудь перейдете на удаленное хранилище, вы пожалеете об этом... fetch() сбросить сбор и выполнить полную перезагрузку!). Могу ли я предложить вам, возможно, попытаться переписать это, не заботясь о мобильном устройстве jQuery и просто попытаться заставить его работать с Backbone.Router + с одной коллекцией + не привязываться к телу, а вместо этого создавать представления "на лету" и добавлять их в тело/удалить когда вы закончите? Вы увидите, что ошибки будут менее странными и легче отслеживать.