Comment introduire les fichiers js dans vue

Il existe quatre façons d'introduire des fichiers JS externes dans Vue.js : via la balise <script> Importez des fichiers JS modulaires via l'instruction d'importation. Enregistrez les fichiers JS en tant que composants Vue via la méthode Vue.component(). Mélangez le code du fichier JS avec plusieurs composants Vue via la méthode Vue.mixin().

Introduction de fichiers JS dans Vue.js

Vue.js fournit une variété de méthodes pour introduire des fichiers JavaScript externes, notamment :

1 Via <script>. Balise <script> 标签

在 Vue 模板中，可以使用 <script> 标签引入 JS 文件：

<code class="html"><script src="./my-script.js"></script></code>

2. 通过 import 语句

对于模块化的 JavaScript 文件，可以通过 import 语句进行导入：

<code class="js">import myModule from './my-module.js'</code>

3. 通过 Vue.component() 方法

如果需要将 JavaScript 文件作为 Vue 组件注册，可以使用 Vue.component() 方法：

<code class="js">Vue.component('my-component', {
  // ... 组件配置
  template: '<div></div>',
  // ... 组件方法
  created() {
    // 组件创建时执行
    this.fetchData()
  },
  methods: {
    fetchData() {
      // ... 从 JavaScript 文件中获取数据
    }
  }
})</code>

4. 通过 Vue.mixin() 方法

如果需要将 JavaScript 文件中的代码与多个 Vue 组件混合，可以使用 Vue.mixin()

Dans le modèle Vue, vous pouvez utiliser la balise <script> pour introduire les fichiers JS :

<code class="js">const myMixin = {
  data() {
    return {
      // ... 混合数据
    }
  },
  methods: {
    // ... 混合方法
  }
}

Vue.mixin(myMixin)</code>

• 2 via l'instruction import
• . Pour la modularisation, les fichiers JavaScript peuvent être importés via l'instruction import :
• rrreee

3 Via la méthode Vue.component() 🎜🎜🎜Si vous devez enregistrer le JavaScript. en tant que composant Vue, vous pouvez utiliser la méthode Vue.component() : 🎜rrreee🎜🎜4 Utilisez la méthode Vue.mixin() 🎜🎜🎜Si vous. devez combiner le code du fichier JavaScript avec plusieurs Pour mélanger des composants Vue, vous pouvez utiliser la méthode Vue.mixin() : 🎜rrreee🎜Lorsque vous utilisez ces méthodes pour introduire des fichiers JS, vous devez prendre en compte ce qui suit : 🎜🎜🎜Assurez-vous que le chemin d'accès au fichier JS est correct. 🎜🎜Si vous utilisez du JavaScript modulaire, vous devez vous assurer que Babel ou webpack est correctement configuré. 🎜🎜Choisissez la méthode d'introduction la plus appropriée en fonction de la situation spécifique. 🎜🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!