Das Frontend-Framework Vue.js ist für viele Entwickler zur ersten Wahl geworden. In Vue.js-Projekten ist es sehr wichtig, ein gutes Gerüst zu verwenden, das nicht nur Entwicklungszeit spart, sondern auch die Wartbarkeit und Skalierbarkeit des Codes verbessert. Bei der Verwendung des Vue.js-Gerüsts stellt sich jedoch häufig die Frage: Wo sollen die JS-Dateien abgelegt werden?
Das erste, was Sie verstehen müssen, ist: Im Vue.js-Projekt gibt es zwei Haupttypen von JavaScript-Dateien: Vue-Komponenten (.vue-Dateien) und unabhängige JavaScript-Dateien (.js-Dateien).
Die Vue-Komponente ist eine eigenständige Einheit, die HTML-, CSS- und JavaScript-Code enthält. Das Gerüst von Vue.js verarbeitet Komponenten in Form von .vue-Dateien, die aus Vorlagen, Skripten und Stilen für Vue-Komponenten bestehen. Diese Datei befindet sich im Allgemeinen im Ordner src/components. Jeder Vue-Komponentenordner sollte Folgendes enthalten:
[name].vue
wobei [Name] durch den Namen der Komponente ersetzt werden kann. Zum Beispiel Header.vue, Footer.vue usw. Jede .vue-Datei sollte den folgenden Inhalt enthalten:
<template> <!-- HTML代码 --> </template> <script> export default{ // JavaScript代码 }; </script> <style> /* CSS代码 */ </style>
In Vue-Komponenten sollte DOM-Manipulation so weit wie möglich vermieden werden und der gesamte JavaScript-Code sollte auf den Umfang der aktuellen Komponente beschränkt sein.
Die Vue-Komponente definiert HTML-Inhalte über das -Tag, das