Maison  >  Article  >  interface Web  >  Où mettre le code js commun dans vue

Où mettre le code js commun dans vue

下次还敢
下次还敢original
2024-05-02 21:15:40817parcourir

Il existe deux endroits pour stocker le code JS public dans Vue : fichier main.js : utilisé pour initialiser les instances Vue et définir les configurations globales pour garantir que le code public est accessible dans tous les composants. Fichiers JS dans le répertoire public/ : peuvent être chargés dans la page via CDN ou serveur.

Où mettre le code js commun dans vue

L'emplacement où le code JS public est stocké dans Vue

Dans Vue.js, le code JS public est généralement placé aux deux emplacements suivants :

1 main.js file <code>main.js 文件

main.js 文件是 Vue 项目的入口文件,主要用于初始化 Vue 实例和设置全局配置。将公用 JS 代码放置在这里可以确保它在所有组件中都可以访问。

示例:

<code class="javascript">// main.js
import Vue from 'vue'
import MyGlobalFunc from './utils/myGlobalFunc'

Vue.component('my-component', {
  // ...
})

Vue.mixin({
  methods: {
    myGlobalFunc() {
      return MyGlobalFunc()
    }
  }
})</code>

2. public/ 目录中的 JS 文件

public/ 目录用于存放静态资源,例如 CSS、JS 和图像。将公用 JS 代码放置在这里可以让它们通过 CDN 或服务器直接加载到页面中。

示例:

public/js/utils.js

Le fichier main.js est le fichier d'entrée du projet Vue Il est principalement utilisé pour initialiser l'instance Vue et définir la configuration globale. Placer le code JS commun ici garantit qu'il est accessible dans tous les composants.

🎜🎜Exemple : 🎜🎜
<code class="javascript">export function myGlobalFunc() {
  // ...
}</code>
🎜🎜2. Fichiers JS dans le répertoire public/ 🎜🎜🎜Le répertoire public/ est utilisé pour stocker des ressources statiques, telles que CSS. , JS et image. Placer du code JS commun ici permet de les charger directement dans la page via un CDN ou un serveur. 🎜🎜🎜Exemple : 🎜🎜🎜Dans public/js/utils.js : 🎜
<code class="javascript">// MyComponent.vue
<script>
import { myGlobalFunc } from '@/js/utils'

export default {
  methods: {
    myMethod() {
      myGlobalFunc()
    }
  }
}
</script></code>
🎜Puis dans le composant utilisez : 🎜rrreee

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn