Vue 에서 Element-UI 구성 요 소 를 정확하게 사용 하 는 방법 인 스 턴 스

2143 단어 vueelement-ui구성 요소
CDN
현재unpkg.com/element-ui를 통 해 최신 버 전의 자원 을 얻 을 수 있 으 며,페이지 에 js 와 css 파일 을 도입 하면 사용 할 수 있 습 니 다.

<!--      -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!--       -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
npm 설치
1.터미널 열기(개발 도구 에서 열기 또는(win+r)후 cmd 입력)
2,대응 하 는 항목 에 진입
예:
3.입력vue add element후 차 로 돌아 가 잠시 기 다 립 니 다.
4.전역 도입(Fully import)인지 필요 에 따라 도입(Import on demand)하 는 지 알려 줍 니 다.Fully import 리 턴 을 선택 하면 됩 니 다.

5,그리고 알림(N Enter 를 입력 하면 됩 니 다)

6.그리고 언어 선택 을 알려 줍 니 다.zh-CN 리 턴 을 선택 하면 됩 니 다.

7.도입 완료(src 디 렉 터 리 에 plugins 폴 더 와 element.js 파일 을 추가 합 니 다)


3.성공 도입 여부 테스트
1.main.js 파일 에 element.js 를 도입 합 니 다.

import './plugins/element.js'

.vue 파일 에 마지막<el-button>el-button</el-button>실행 항목 을 입력 하 십시오.다음 그림 의 단추 효과 가 나타 나 면 도입 성공 을 표시 합 니 다!
 
4.마지막 으로 Element-UI 구성 요소 라 이브 러 리 의 사용 문서 주 소 를 첨부 합 니 다.
https://element.eleme.cn/#/zh-CN/component/installation
총결산
Vue 에서 Element-UI 구성 요 소 를 올 바 르 게 사용 하 는 것 에 관 한 이 글 은 여기까지 소개 되 었 습 니 다.더 많은 Vue 에서 Element-UI 구성 요 소 를 사용 하 는 내용 은 이전 글 을 검색 하거나 아래 의 관련 글 을 계속 찾 아 보 세 요.앞으로 도 많은 응원 부 탁 드 리 겠 습 니 다!
Delphi 충돌 구체 전체 인 스 턴 스 코드 구현
JS 는 지정 한 문 자 를 모두 다른 문자 인 스 턴 스 코드 로 변환 합 니 다.

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage