So benennen Sie Vue-Komponenten

Question

Ich habe vier Komponenten: comments.vue, comments-list.vue, comment.vue, comment-new.vue.

comments.vue verwendet andere Komponenten Anzeige:

1. Liste Kommentare (keine Ajax-Aufrufe hat)

   ein. Welche einzelnen Kommentar enthält (im Grunde ist es nur eine Vorlage mit einzelner Eigenschaft)

2. Textarea Kommentar senden (hat Ajax-Aufrufe)

comments.vue hat alle Logik paginierte Kommentare meine Frage zu laden

So Ist das eine gute Trennung der Verantwortlichkeiten?

Answer 1

Sie dies, Vue.js Component Style Guide

Von der Führung:

Vue Komponentennamen

Jede Komponente Name sein muss:

• Bedeutungsvolles: nicht über spezifische, nicht übermäßig abstrakt.
• Kurz: 2 oder 3 Wörter.
• Aussprechbar: wir wollen über sie reden können.

Vue Komponentennamen muss auch sein:

• Benutzerdefinierte Element Spezifikation konform: include einen Bindestrich, nicht Namen reserviert verwenden.
• app- namespaced: wenn sehr generisch und sonst 1 Wort, so dass es leicht in anderen Projekten wiederverwendet werden kann.

Warum?

Der Name wird verwendet, um über die Komponente zu kommunizieren. Es muss also kurz, bedeutungsvoll und aussprechbar sein.

Wie?

<!-- recommended --> 
<app-header></app-header> 
<user-list></user-list> 
<range-slider></range-slider> 

<!-- avoid --> 
<btn-group></btn-group> <!-- short, but unpronounceable. use `button-group` instead --> 
<ui-slider></ui-slider> <!-- all components are ui elements, so is meaningless --> 
<slider></slider> <!-- not custom element spec compliant -->