Warum Komponenten in Vue.js oder React verwenden?

Question

Nachdem ich Vue.js eine Weile ausprobiert hatte, brachte es mich zum Nachdenken ... Warum müssen wir Komponenten verwenden? Ich verstehe den Hype hinter ihnen nicht, da ich einfach eine for-Schleife nehmen und ein div erstellen kann und die exakt gleiche Ausgabe bekomme, als ob ich Komponenten verwende.

Vue.js Dokumentation selbst sagt:

Komponenten sind eine der mächtigsten Funktionen von Vue. Sie helfen Ihnen, grundlegende HTML-Elemente zu erweitern, um wiederverwendbaren Code zu kapseln.

Aber nochmal, es scheint, es kann mit for-Schleifen gemacht werden, welche Komponenten Ihnen geben.

Das Gleiche gilt auch für React.

Wenn jemand es besser erklären kann, bin ich ganz Ohr.

Danke.

Answer 1

Keine Komponenten in Vue.js oder React zu verwenden ist wie mit einem Hammer für alles. Sie können natürlich versuchen, eine Schraube mit einem Hammer zu nageln, aber nicht jeder wird Sie verstehen, warum, wie Sie jedes GUI-Element mit divs anstelle von CustomXComponent implementieren können.

Verwenden von Komponenten ist wie mit einem Schraubenzieher etwas zu schrauben. Nicht nur ihre Namen und Formen stimmen mit dem überein, was Sie erreichen möchten, sondern sie sind auch schneller. Sie nicht zu benutzen, kann wie ein unprofessionelles Verhalten aussehen und sich nicht an die richtigen Werkzeuge für die richtigen Dinge anpassen.

Wenn Sie in eine Reihe von divs schauen, müssen Sie weiter nach unten schauen, was sie tun. Wenn ich Ihnen eine benutzerdefinierte Komponente mit dem Namen AutoCompleteSearch gebe, können Sie abstrahieren, was es tut, obwohl es unter Verwendung der einfachen divs implementiert wurde.

Answer 2

Aus dem gleichen Grund, dass Sie eine for-Schleife anstelle von kopieren und Einfügen der gleichen Sache N mal verwenden möchten - das Endergebnis für den Benutzer ist das gleiche, aber Sie hätten Code, der wesentlich schwieriger zu verstehen ist , pflegen und aktualisieren.

Answer 3

Komponenten sind sehr nützlich, weil sie in einem viel komplexeren Kontext als eine Handvoll div verwendet werden sollen.

Stellen Sie sich zum Beispiel vor, Sie müssten Ihrer Seite einen Kalender hinzufügen, zusammen mit einer großen Tabelle mit Daten, einem großen Formular, Dialogfeldern und anderen UI-Elementen. Es ist sicher doable ohne Komponenten, aber es wird viel einfacher zu pflegen und lesbarer, wenn Sie Ihren Code in Komponenten teilen.