> 웹 프론트엔드 > View.js > Vue에 공통 js 코드를 넣을 위치

Vue에 공통 js 코드를 넣을 위치

下次还敢
풀어 주다: 2024-05-02 21:15:40
원래의
848명이 탐색했습니다.

Vue에는 공개 JS 코드를 저장할 수 있는 두 가지 위치가 있습니다. main.js 파일: Vue 인스턴스를 초기화하고 전역 구성을 설정하여 모든 구성 요소에서 공개 코드에 액세스할 수 있도록 하는 데 사용됩니다. public/ 디렉토리의 JS 파일: CDN 또는 서버를 통해 페이지에 로드될 수 있습니다.

Vue에 공통 js 코드를 넣을 위치

Vue에서 공개 JS 코드가 저장되는 위치

Vue.js에서 공개 JS 코드는 일반적으로 다음 두 위치에 배치됩니다:

1. 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

main.js 파일은 Vue 프로젝트의 항목 파일로 주로 Vue 인스턴스를 초기화하고 전역 구성을 설정하는 데 사용됩니다. 여기에 공통 JS 코드를 배치하면 모든 구성 요소에서 액세스할 수 있습니다.

🎜🎜예: 🎜🎜
<code class="javascript">export function myGlobalFunc() {
  // ...
}</code>
로그인 후 복사
🎜🎜2. public/ 디렉터리의 JS 파일 🎜🎜🎜public/ 디렉터리는 CSS와 같은 정적 리소스를 저장하는 데 사용됩니다. , JS 및 이미지. 여기에 공통 JS 코드를 배치하면 CDN 또는 서버를 통해 페이지에 직접 로드할 수 있습니다. 🎜🎜🎜예: 🎜🎜🎜 public/js/utils.js에서: 🎜
<code class="javascript">// MyComponent.vue
<script>
import { myGlobalFunc } from '@/js/utils'

export default {
  methods: {
    myMethod() {
      myGlobalFunc()
    }
  }
}
</script></code>
로그인 후 복사
🎜그런 다음 구성 요소에서 사용: 🎜rrreee

위 내용은 Vue에 공통 js 코드를 넣을 위치의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿