Backbone (anche la marionetta) tenta di visualizzare un nuovo record all'inizio di una raccolta, senza re-rendering dell'intera collezione

Question

Sto provando a visualizzare un elemento all'inizio di una raccolta (immagina se stavi postando un nuovo record su facebook)

Quando arrivo ad aggiungere (risposta, {a: 0}); nella raccolta, il record viene inserito correttamente a 0 nella raccolta, ma viene visualizzato nella parte inferiore dell'elenco di elementi. Sono confuso perché avevo già funzionato prima, ma penso che quello che stavo facendo in uno stile hacky, è stato appena resettato e re-rendering della collezione.

Mi chiedo quale sia il modo ordinato di gestire questo e dove dovrei legare la logica.

È sul metodo di aggiunta della raccolta? Attualmente questo è vuoto (ma sto usando la marionetta) e ritengo che questo sovrascriva il rendering di default del backbone. Come posso riprenderlo di nuovo, così posso correttamente aggiungere il mio nuovo elemento alla lista, senza distruggerlo tutto e ricrearlo.

Answer 1

In Marionette, il modo predefinito per aggiungere un nuovo elemento a una raccolta nelle viste consiste nell'utilizzare il metodo append di jQuery. Il tipo CollectionView ha un metodo chiamato appendHtml che viene utilizzato per l'aggiunta effettiva. (vedi http://derickbailey.github.com/backbone.marionette/docs/backbone.marionette.html#section-24)

Tuttavia, è possibile sovrascrivere questo metodo nella vista di raccolta specifica e aggiungere il nuovo modello ovunque sia necessario.

Nel tuo caso, se siete sempre voglia di anteporre il nuovo modello in cima alla lista, è molto banale per modificare la visualizzazione raccolta per fare questo:

Backbone.Marionette.CollectionView.extend({ 
    appendHtml: function(cv, iv){ 
    cv.$el.prepend(iv.el); 
    } 
}); 

Nota che cv è la collezione visualizza istanza e iv è l'istanza di visualizzazione dell'elemento per il modello nella raccolta.

Se è necessario eseguire operazioni più complesse come trovare una posizione esatta nella raccolta esistente di nodi HTML, è possibile farlo anche con la funzione appendHtml. Ovviamente questo diventa più complicato di una semplice aggiunta piuttosto che un'append, ma è ancora possibile.

Spero che questo aiuti.