Rumah > hujung hadapan web > View.js > teks badan

Di mana untuk meletakkan kod js biasa dalam vue

下次还敢
Lepaskan: 2024-05-02 21:15:40
asal
840 orang telah melayarinya

Terdapat dua tempat untuk menyimpan kod JS awam dalam Vue: fail main.js: digunakan untuk memulakan tika Vue dan menetapkan konfigurasi global untuk memastikan kod awam boleh diakses dalam semua komponen. Fail JS dalam direktori awam/: boleh dimuatkan ke dalam halaman melalui CDN atau pelayan.

Di mana untuk meletakkan kod js biasa dalam vue

Lokasi tempat kod JS awam disimpan dalam Vue

Dalam Vue.js, kod JS awam biasanya diletakkan di dua lokasi berikut:

1 js. code> fail 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>
Salin selepas log masuk

2. public/ 目录中的 JS 文件

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

示例:

public/js/utils.js

main.js fail ialah fail kemasukan projek Vue Ia digunakan terutamanya untuk memulakan tika Vue dan menetapkan konfigurasi global. Meletakkan kod JS biasa di sini memastikan ia boleh diakses dalam semua komponen.

🎜🎜Contoh: 🎜🎜
<code class="javascript">export function myGlobalFunc() {
  // ...
}</code>
Salin selepas log masuk
🎜🎜2. Fail JS dalam direktori public/ 🎜🎜🎜 Direktori public/ digunakan untuk menyimpan sumber statik, seperti CSS , JS dan imej. Meletakkan kod JS biasa di sini membolehkan mereka dimuatkan terus ke halaman melalui CDN atau pelayan. 🎜🎜🎜Contoh: 🎜🎜🎜Dalam public/js/utils.js: 🎜
<code class="javascript">// MyComponent.vue
<script>
import { myGlobalFunc } from '@/js/utils'

export default {
  methods: {
    myMethod() {
      myGlobalFunc()
    }
  }
}
</script></code>
Salin selepas log masuk
🎜Kemudian dalam penggunaan komponen: 🎜rrreee

Atas ialah kandungan terperinci Di mana untuk meletakkan kod js biasa dalam vue. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan