javascript - Double view render in routers -

var router = backbone.router.extend({     routes:{         'notes': 'shownotes',         "note/:noteid":       "opennote"     },      shownotes: function() {         new app.notesview;     },      opennote: function(noteid) {         var notescollection = new app.notescollection();         notescollection.fetch();          var view = new app.notesview({             currentmodel : notescollection.get(noteid)         })      } }); 

here problem comes when navigate domain.com/#notes every time navigate there double view occurs, , event get's fired multiple times.

i think it's because every time go there, create new view (the old view still exists). instead, can create view once , on shownotes, call render?

also, side note, fetch() asynchronous call have wait until data fetched passing in callback (success function) , doing calculations there.

something this:

var notesview = new app.notesview;  var router = backbone.router.extend({ routes:{     'notes': 'shownotes',     "note/:noteid":       "opennote" },  shownotes: function() {     notesview.render(); // or append notesview.$el dom somewhere },  opennote: function(noteid) {     var notescollection = new app.notescollection();     notescollection.fetch({         success: function(){             notesview.setmodel(notescollection.get(noteid); // make method youself         }     }); } 

});