Ich habe eine Ansicht namens DashboardView
, die mehrere WidgetView
s instanziiert. Jedes Widget muss über eigene Ereignisbindungen verfügen. Soweit ich das beurteilen kann, gehen diese Bindungen verloren, wenn die Ansicht gerendert und der übergeordneten Ansicht hinzugefügt wird, d. H .:
Auf diese Weise gehen die Klickereignisse im Element .config
des Widgets verloren. Gibt es eine bessere Möglichkeit, die verschachtelten Ansichten in das übergeordnete Element zu mixen, während sichergestellt wird, dass die Ereignishandler in der untergeordneten Ansicht korrekt geleitet werden?
Eine Lösung, die ich für dieses Problem gesehen habe, finden Sie in diesem Artikel . Das sieht gut aus, aber ich bin neugierig, ob es eine elegantere Lösung gibt.
Versuchen Sie Folgendes:
%Vor%Also, die Idee ist dies:
(1) In der Methode WidgetView
render
füllen Sie @el
(das Wurzelelement der Ansicht) mit den Daten des Modells über die Vorlage auf. (Und beachte, wie ich die Vorlage nur einmal kompiliere - die Vorlage muss nicht bei jeder Render-Operation kompiliert werden.)
(2) Innerhalb von DashboardView
fügen Sie das Wurzelelement des Widgets - @el
- an das DOM an.
Die Ereignisse der Ansicht delegieren an ihr Wurzelelement - @el
. Daher möchten Sie explizit mit dem Stammelement arbeiten: Innerhalb von render
füllen Sie es aus und fügen es dann an das DOM an.
Ihr Problem ist, dass delegateEvents
ein einzelnes, sich nicht änderndes Element für Ihre Ansicht erwartet. Da Ihre Funktion render
jedes Mal ein neues Element erstellt, werden die Bindungen von delegateEvents
niemals ausgelöst, wenn Sie auf das von render
generierte Element klicken.
Glücklicherweise bietet die aktuelle Version von Backbone eine Methode setElement
, die Ihrem Element das von Ihnen angegebene Argument zuweist, und dann wird automatisch delegateEvents
aufgerufen.
Tags und Links javascript coffeescript backbone.js backbone-events