Heim  >  Artikel  >  Web-Frontend  >  So importieren Sie js in main.js in uniapp

So importieren Sie js in main.js in uniapp

PHPz
PHPzOriginal
2023-04-27 09:06:111888Durchsuche

UNIAPP ist ein Front-End-Framework, das die plattformübergreifende Entwicklung unterstützt, seine flexible Skalierbarkeit und leistungsstarke Leistung ermöglicht es Entwicklern, Anwendungen auf der Grundlage einer Entwicklung einfach auf mehreren Plattformen zu veröffentlichen. In UNIAPP ist main.js eine wichtige Startdatei. Ihre Hauptfunktion besteht darin, die globale Initialisierung und Konfiguration durchzuführen, einschließlich des Imports von JS-Dateien. Schauen wir uns an, wie man JS-Dateien in UNIAPP importiert.

1. JS-Dateien in main.js importieren

In UNIAPP können Sie JS-Dateien an jedem Ort in main.js importieren. Sie können auf der obersten oder der untersten Ebene platziert werden. Die spezifischen Schritte sind wie folgt:

1. Fügen Sie den folgenden Code in main.js hinzu:

import "./util.js";

2. Platzieren Sie die JS-Dateien, die importiert werden müssen, in der Datei util.js im Projektverzeichnis.

3. Fügen Sie benutzerdefinierte Funktionen oder Variablen in die util.js-Datei ein, zum Beispiel:

function sum(a, b) {
   return a + b;
}
export default sum;

2. JS-Dateien in Vue-Komponenten verwenden

Nachdem wir die JS-Datei erfolgreich in die main.js-Datei importiert haben, können wir diese JS Die Datei wird in allen Vue-Komponenten verwendet. Zur Vereinfachung der Demonstration zeigen wir den spezifischen Prozess in einer Vue-Komponente.

1. Fügen Sie den folgenden Code zur Datei HelloWorld.vue hinzu:

<script>
import { sum } from "@/util.js";

export default {
  data() {
    return {
      num1: 1,
      num2: 2,
    };
  },
  methods: {
    handleClick() {
      const result = sum(this.num1, this.num2);
      console.log(result);
    },
  },
};
</script>

2. Fügen Sie benutzerdefinierte Funktionen oder Variablen zur Datei util.js hinzu, zum Beispiel:

export function sum(a, b) {
  return a + b;
}

3. Importieren Sie in UNIAPP die JS-Datei Es ist ganz einfach: Fügen Sie einfach Code in die Datei main.js ein. Da es sich bei der Datei main.js um die Eingabedatei für die globale Initialisierung handelt, können in dieser Datei globale Konfigurationen und Importe durchgeführt werden. Gleichzeitig ist es auch sehr praktisch, JS-Dateien in Vue-Komponenten zu verwenden. Sie müssen sie nur in die Komponenten importieren, die Sie verwenden müssen. Darüber hinaus ist zu beachten, dass Sie beim Importieren von JS-Dateien in Vue-Komponenten relative Pfade oder das @-Symbol verwenden müssen, da sonst ein Fehler auftritt, der nicht geladen werden kann.

Das obige ist der detaillierte Inhalt vonSo importieren Sie js in main.js in uniapp. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn