vue.use 메소드를 사용하는 방법

vue.use 메소드 사용: 먼저 Vue.js 플러그인을 설치한 다음 전역 메소드인 'Vue.use()'를 통해 플러그인을 사용합니다. 해당 구문은 'vue.use(plugin,args'입니다. )".

이 튜토리얼의 운영 환경: windows7 시스템, vue2.0 버전, thinkpad t480 컴퓨터.

추천: "vue Tutorial"

공식 API 소개:

Vue.use(plugin)

공식 웹사이트에서 제공하는 설명은 다음과 같습니다: 전역 메소드 Vue.use()를 통해 플러그인을 사용하세요.

vue.use（plugin, arguments）

Parameters

{Object | function} plugin

Usage

Vue.js 플러그인을 설치하세요. 플러그인이 객체인 경우 설치 방법을 제공해야 합니다. 플러그인이 함수인 경우 설치 방법으로 작동합니다. install 메소드가 호출되면 Vue가 매개변수로 전달됩니다.

이 메서드는 New Vue()를 호출하기 전에 호출되어야 합니다.

동일한 플러그인에서 install 메소드를 여러 번 호출하면 해당 플러그인은 한 번만 설치됩니다.

Element-UI 예제

ElementUI 문서에 따르면 Vue cli로 빌드된 프로젝트에서 ElementUI를 이렇게 사용합니다

/*
mian.js
*/
import Vue from 'vue';
import ElementUI from 'element-ui'; // 1
import 'element-ui/lib/theme-chalk/index.css';
import App from './App.vue';
Vue.use(ElementUI); // 2
new Vue({
el: '#app',
render: h => h(App)
});

위 코드로 Element 소개가 완료됩니다. 스타일 파일을 별도로 가져와야 한다는 점에 유의하세요. .

나중에 를 사용하여 Vue의 단일 파일 구성 요소에서 Element 요소를 직접 사용할 수 있습니다.

그럼 정확히 무슨 일이 일어났나요?

1. 첫 번째 댓글은 ElementUI

import ElementUI from 'element-ui'
// TODO 理解如何导入模块

로 가져옵니다. 다음은 src/index.js의 내용입니다. 보시다시피 index.js는 객체를 내보냅니다. 위 import 문에서 이 객체에는 ElementUI라는 변수 이름이 지정됩니다. 여기에서 설치 기능을 참고하세요.

/*
index.js
*/export default {
  version: '2.11.1',
  locale: locale.use,
  i18n: locale.i18n,
  install,
  ...
};

2. 두 번째 코멘트는 ElementUI를 설치하는 것입니다

Vue.use(ElementUI);

여기에서는 Vue.use 메소드가 사용되고 ElementUI 객체가 전달되는 것을 관찰했습니다. Vue.use 문서에서 ElementUI 객체의 설치 메소드를 호출하고 Vue를 전달한다는 것을 알 수 있습니다.

위 내용은 vue.use 메소드를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!