5Das (neue) Reactivity-System

Mit Reactivity wird ein Kernkonzept zusammengefasst, das den Unterschied von modernen Web-Frameworks zu reinem JavaScript oder Bibliotheken wie jQuery verdeutlicht. Es ist der Unterschied zwischen deklarativem und imperativem Rendering. In Vue sind die Template-Syntax und das virtuelle DOM zwei Kernaspekte davon. In jQuery, um bei dem Beispiel zu bleiben, müssen Änderungen an der Oberfläche ganz explizit gesetzt werden. Eine Funktion ändert direkt einen Wert im DOM, fügt eine CSS-Klasse hinzu oder löscht ein Kindelement. Das nachfolgende Code-Snippet zeigt das an einem Beispiel, bei dem eine CSS-Klasse zu DOM-Elementen hinzugefügt wird, wenn ein Button-Klick erfolgt.

$('button').click(function() {

$('h1, p').addClass('important'); ...

Get Vue.js now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.