Właśnie użyłem linii poleceń ( CLI
), aby zainicjować projekt Vue.js. CLI
Stworzył src/components
i src/views
folder.
Minęło kilka miesięcy, odkąd pracowałem nad projektem Vue i struktura folderów wydaje mi się nowa.
Jaka jest różnica między folderami views
i components
w projekcie Vue wygenerowanym za pomocą vue-cli
?
Odpowiedzi:
Przede wszystkim oba foldery
src/components
isrc/views
zawierają komponenty Vue.Kluczowa różnica polega na tym, że niektóre komponenty Vue działają jako widoki na potrzeby routingu.
W przypadku routingu w Vue, zwykle w Vue Router , trasy są definiowane w celu przełączenia bieżącego widoku używanego w
<router-view>
komponencie. Te trasy są zwykle zlokalizowane pod adresemsrc/router/routes.js
, gdzie możemy zobaczyć coś takiego:Komponenty znajdujące się poniżej
src/components
są mniej prawdopodobne, że zostaną użyte na trasie, podczas gdy komponenty znajdujące się poniżejsrc/views
będą używane przez co najmniej jedną trasę.Vue CLI ma na celu szybki rozwój Vue.js, zapewnia prostotę i elastyczność. Jego celem jest umożliwienie zespołom o różnym poziomie umiejętności skonfigurowania nowego projektu i rozpoczęcia pracy.
W końcu to kwestia wygody i struktury aplikacji .
src/router
jak tego przedsiębiorstwa boilerplate.Wybierz strukturę aplikacji, która najlepiej pasuje do projektu, nad którym pracujesz.
źródło
src/components
z tą konwencją?Myślę, że to bardziej konwencja. Coś, co nadaje się do ponownego użycia, może być przechowywane w folderze src / components, coś, co jest powiązane z routerem, może być przechowywane w src / views
źródło
Ogólnie sugeruje się umieszczanie widoków wielokrotnego użytku w
src/components
katalogu. Przykłady, takie jak nagłówek, stopka, reklamy, siatki lub dowolne niestandardowe elementy sterujące, takie jak stylizowane pola tekstowe lub przyciski. W widoku można uzyskać dostęp do jednego lub większej liczby komponentów.Widok może mieć komponent (i), a widok jest faktycznie przeznaczony do otwierania za pomocą adresu URL nawigacji. Zazwyczaj są umieszczane w
src/views
.Pamiętaj, że nie jesteś ograniczony, aby uzyskać dostęp do składników za pośrednictwem adresu URL. Możesz dodać dowolny komponent do
router.js
i uzyskać do niego dostęp. Ale jeśli masz to zrobić, możesz przenieść go dosrc/views
folderu, zamiast go umieszczaćsrc/components
.Składniki są kontrolkami użytkownika, analogicznie do formularzy internetowych asp.net.
Chodzi tylko o ustrukturyzowanie kodu w celu lepszej obsługi i czytelności.
źródło
Oba foldery są zasadniczo takie same, ponieważ oba zawierają komponenty, ale estetyka Vue polega na tym, że komponenty, które będą działać jako strony (kierowane do podobnej strony w celu nawigacji) są przechowywane w
/views
folderze, podczas gdy komponenty wielokrotnego użytku, takie jak pola formularzy, są przechowywane w/components
folderze .źródło