main.js 공통함수 전역 선언하기

컨포넌트에서 공용으로 사용할 파일 이름을 생성한다.

common-plugin.js

 

common-plugin.js 예시

const methods = {
    setTestOpts: () => {
          return 'test'
   }
}

export default {

    install (Vue) {
    	Vue.prototype.$setTestOpts = methods.setTestOpts
    }

}

 

 

나는 테스트용으로 'test'라는 스트링 값을 리턴하는 함수를 작성하였다.

vue의 글로벌 메소드인 install을 사용하여

프로토타입의 객체로 함수를 셋팅하여준다.

 

원하는 작업을 setTestOpts에 구성하면 되겠다.

 

다음은 해당 속성을 전역으로 등록해주는 작업이 필요하다.

 

 

main.js

import CommonPlugin from './plugin/common-plugin.js’

Vue.use(CommonPlugin)

 

main.js에 해당 공통함수 js파일을 임포트 한 후

역시 글로벌 메소드 use로 선언하여 전역으로 등록하여 준다.

 

 

이렇게 까지 하면 컨포넌트의 메소드 안에서

this.$setTestOpts() 를 호출하여 리턴값을 받아볼 수 있다!