Блог

Я создаю небольшое приложение CRUD в Backbone, и я немного застрял с необходимостью перенаправлять из одного представления в другое. Мое приложение состоит из layout представления, в котором отображаются другие представления, и маршрутизатора. Вот оно:

 var router = Backbone.Router.extend({
     routes: {
         '': 'home',
         'resumes/:id': 'showResume'
     },

     home: function () {
         // renders a index view with my collection
         this.layout.render(new ResumeList({collection: resumes});
     },
     showResume: function () {
         if (!this.fullResume) {
             this.fullResume = new FullResume({model: new Resume()});
         }
         // allowing to navigate via url with model id
         this.fullResume.model.set('id', id).fetch({
             context: this,
             success: function () {
                 this.layout.render(this.fullResume);
             }
         });
     }
});
  

Затем, на мой FullResume взгляд, у меня есть delete событие, которое уничтожает модель. Вот оно:

 var FullResume = Backbone.View.extend({
    // tagName and other stuff
    events: {
        // other events
        'click #delete': 'deleteResume'
    },
    // initialize, render and other functions
    deleteResume: function () {
        this.model.destroy({
            success: function (res) {
                console.log('DELETE model'   res.toJSON().id);
            },
            error: function () {
                console.log('Failed to DELETE');
            }
        });
    }
});
  

Приведенная выше функция работает отлично и удаляет модель, но после удаления модели она по-прежнему остается в ее представлении, пока я не перейду куда-нибудь вручную. Я немного прочитал и попытался разобраться, как отображать основное представление после этого события или перенаправлять на него, но не сильно преуспел.

Вы ищете http://backbonejs.org/#Router-navigate функция с trigger параметром, установленным в true.

Вот пример: http://jsfiddle.net/x3t7u5p0 /

Нажатие на ссылки «Главная» или «О программе» изменит представление, однако я добавил отложенное изменение программного представления: когда отображается представление «О программе», оно переключится обратно на Home после задержки

   render: function () {
      this.$el.html(this.template);
      _.delay(function() {
          appRouter.navigate('home', {trigger: true});
      }, 500);
  }