작은 마이크로 채널 UI 컴포넌트 라이브러리 유니 앱 개발 프로그램 소개 (VANT-weapp) 공정

작은 마이크로 채널 UI 컴포넌트 라이브러리 유니 앱 개발 프로그램 소개 (VANT-weapp) 공정

• 여기에서 VANT - weapp 사례 연구
• 유니 응용 프로그램은 공식 문서를 소개하는 구성 요소의 방법을 설명합니다

1. 새로 만들기 디렉토리 관련

• wxcomponents에게 루트 디렉토리 만들기
• 새로운 VANT 디렉토리 아래 wxcomponents

• 완료 후 디렉토리 구조 만들기

  

2. 프로젝트 구성 요소는 VANT - weapp 소개

• 에서 VANT - weapp GitHub의의이 자료 섹션에서 최신 압축 패키지를 다운로드
• 다운로드 한 파일의 압축을 풀고 디렉토리 방금 만든 VANT에 dist 디렉토리에 복사
  

3. UI 구성 요소의 소개 페이지를 사용하여

1. App.Vue의 스타일 파일 라이브러리 파일의 도입의 스타일 UI의 구성 부품
   

@import "/wxcomponents/vant/dist/common/index.wxss";

1. pages.json 구성 파일에서 등록 페이지 구성 요소를 필요

{
    "path": "pages/index/index",
    "style": {
        "usingComponents":{
            "van-button": "/wxcomponents/vant/dist/button/index"
        },
        "navigationBarTitleText": "首页"
    }
}