vuejs 모바일 터미널에는 어떤 UI 프레임워크가 사용됩니까?

vuejs 모바일 터미널에 사용 가능한 UI 프레임워크: 1. iView, 3. Element, 5. Bootstrap-Vue, 7. AT-UI; , 큐브-UI 10, 뮤즈-UI 등

이 튜토리얼의 운영 환경: Windows 7 시스템, vue 버전 2.9.6, DELL G3 컴퓨터.

Vue는 간단하고 명확한 API를 갖춘 경량의 고성능 구성 요소 가능 MVVM 라이브러리로 빠르게 시작할 수 있습니다. Vue는 출시 이후 많은 웹 개발자들로부터 인정을 받았습니다. 회사의 웹 프런트 엔드 프로젝트 개발에서는 Vue 기반 UI 구성 요소 프레임워크를 사용하여 여러 프로젝트를 개발하고 정식으로 사용합니다. Vue.js 프레임워크와 UI 구성 요소 라이브러리를 사용한 후 개발 팀의 개발 효율성이 크게 향상되었으며, 코드 작성량이 줄어들고 많은 인터페이스 효과 구성 요소가 캡슐화되었습니다.

Vue UI 구성 요소 라이브러리를 선택하는 과정에서 별 수, 문서 풍부함, 업데이트 빈도, GitHub 유지 관리 등의 요소를 기반으로 우수한 Vue UI 구성 요소 라이브러리도 수집하고 컴파일했습니다.

1. iView UI 컴포넌트 라이브러리

iView는 Vue.js 기반의 오픈소스 UI 컴포넌트 라이브러리 세트로 주로 PC 인터페이스용 미드엔드 및 백엔드 제품을 서비스하고 있습니다. iView의 구성 요소는 비교적 완벽하고 빠르게 업데이트되며 설명서가 매우 상세합니다. 회사 팀에서 유지 관리하는 비교적 안정적인 Vue UI 구성 요소 프레임워크

입니다. iView 생태계도 매우 잘 돌아가고 있으며, 백엔드 작업에 매우 편리한 오픈소스 iView Admin도 있습니다. 공식 웹사이트에 따르면 iView는 TalkingData, Alibaba, Baidu, Tencent, Toutiao, JD.com, Didi Chuxing, Meituan, Sina, Lenovo 및 기타 대기업과 같은 대기업의 제품에 사용되었습니다.

iView 공식 홈페이지: https://www.iviewui.com/.

2. Vux UI 컴포넌트 라이브러리

Vux는 WeUI와 Vue2.x를 기반으로 개발된 모바일 UI 컴포넌트 라이브러리로 주로 WeChat 페이지를 서비스하고 있습니다. Vux의 위치는 매우 명확합니다. 하나는 Vue 모바일 UI 구성 요소 라이브러리이고 다른 하나는 WeUI의 기본 스타일 라이브러리입니다. Vux의 구성 요소는 모든 WeUI 콘텐츠를 다루며 일반적으로 사용되는 일부 구성 요소도 확장합니다. 예: 고정, 타임라인, V-차트, XCircle.

Vux는 개인이 관리합니다. 그러나 GitHub의 스타는 여전히 매우 높아 13,000에 도달합니다. GitHub에서 문제가 매우 빠르게 종료되는 것을 보았습니다. Vux 문서의 기본 구성 요소 사용법과 효과가 설명되어 있습니다.

Vux 공식 웹사이트에도 많은 Vux 사용 사례가 표시되어 있습니다. WeChat 페이지 개발에는 기본적으로 버그가 많지 않으며 개발이 비교적 원활합니다.

Vux 공식 웹사이트: https://vux.li/.

3. Element UI 구성 요소 라이브러리

Element는 개발자, 디자이너 및 제품 관리자를 위한 Vue 2.0 기반 데스크톱 구성 요소 라이브러리 세트입니다.

Element는 Ele.me의 프런트엔드 오픈소스로 유지 관리되는 Vue UI 구성 요소 라이브러리로, 업데이트 빈도는 여전히 매우 높으며 기본적으로 매주에서 보름에 걸쳐 새 버전이 출시됩니다. 구성 요소는 완전하며 기본적으로 백엔드에 필요한 모든 구성 요소를 포함합니다. 문서에 자세히 설명되어 있으며 많은 예가 있습니다. 나는 실제로 그것을 사용한 적이 없습니다. 인터넷에는 많은 Element 튜토리얼과 기사가 있습니다.

요소는 비교적 고품질의 Vue UI 구성 요소 라이브러리여야 합니다.

Element 공식 웹사이트: http://element.eleme.io/#/zh-CN.

4. Mint UI 컴포넌트 라이브러리

Mint UI는 역시 Ele의 Vue.js 기반 모바일 컴포넌트 라이브러리입니다. .me 프론트엔드 프로젝트. Mint UI는 진정으로 요청 시 구성 요소를 로드하는 것입니다. 선언된 구성 요소와 해당 스타일 파일만 로드할 수 있습니다. Mint UI는 CSS3를 사용하여 다양한 애니메이션을 처리하여 불필요한 브라우저 다시 그리기 및 리플로우를 방지하여 사용자가 원활하고 원활한 경험을 할 수 있도록 합니다.

많은 온라인 비디오 튜토리얼이 Mint UI를 기반으로 하며 모바일 웹 프로젝트 개발이 매우 편리하고 문서도 매우 간결하고 명확합니다. 많은 페이지 Mint UI 구성요소가 캡슐화되어 있으며, 기본적으로 예제에 따라 작성하고 간단한 조정만으로 구현할 수 있습니다.

그러나 GitHub에 마지막 코드 제출이 2018년 1월 16일이었고, 이는 반년 전입니다. 프로젝트가 비교적 안정적이어서 업데이트가 되지 않은 것인지, 아니면 프로젝트가 포기될 수도 있는지는 모르겠습니다. 우리는 Mint UI의 역학에 계속해서 주목하겠습니다.

Mint UI 공식 웹사이트: http://mint-ui.github.io/.

5. Bootstrap-Vue UI 구성 요소 라이브러리

Bootstrap-VUE는 vue2 기반의 Bootstrap V4 구성 요소 및 그리드 시스템 구현을 제공합니다. , 광범위하고 자동화된 WAI ARA 접근성 마크업을 완벽하게 갖추고 있습니다. uiv는 Vue2를 기반으로 한 Bootstrap 3 구현입니다. Bootstrap 4는 최신 버전입니다. Bootstrap 3에 비해 더 구체적인 클래스가 있고 일부 관련 부분을 관련 구성 요소로 변환합니다. 동시에 Bootstrap.min.css의 크기는 40% 이상 감소했습니다.

Bootstrap4는 IE8 및 iOS 6에 대한 지원을 포기했으며 이제 IE9 이상 및 iOS 7 이상 브라우저만 지원합니다. 반응형 웹사이트가 처음 대중화되었을 때, 부트스트랩은 전 세계적으로 모바일 우선 웹사이트 구축을 위한 가장 인기 있는 프레임워크였습니다.

지금도 많은 기업 웹사이트가 부트스트랩을 사용하여 반응형으로 운영되고 있습니다. Bootstrap-Vue를 사용하면 Vue에서 Bootstrap 효과를 얻을 수 있습니다.

Bootstrap-Vue 공식 홈페이지: https://bootstrap-vue.js.org/
uiv 공식 홈페이지: https://uiv.wxsm.space/.

6. Ant Design Vue UI 구성 요소 라이브러리

Ant Design Vue는 엔터프라이즈 수준 백엔드 제품용으로 개발 및 제공되는 Ant Design 3.X의 Vue 구현입니다. 여러 Ant Design Vue 구성 요소는 GitHub에서 찾을 수 있습니다. 그러나 이에 비해 Ant Design Vue가 더 좋습니다.

Ant Design Vue는 React 디자인 도구 시스템의 Ant Design을 공유하고, React 구성 요소의 모든 Ant Design을 구현하며, 최신 브라우저와 IE9 이상(폴리필 필요)을 지원합니다. Ant Design에 익숙한 사람들도 Vue를 사용할 때 쉽게 시작할 수 있습니다.

Ant Design Vue 공식 웹사이트: https://vuecomComponent.github.

7. AT-UI UI 컴포넌트 라이브러리

AT-UI는 주로 Vue.js 2.0을 기반으로 하는 프런트엔드 UI 컴포넌트 라이브러리입니다. 최신 브라우저와 IE9 이상을 지원하는 PC 웹사이트용 미드엔드 및 백엔드 제품을 신속하게 개발하는 데 사용됩니다. AT-UI는 보다 간소화되었으며 일반적으로 사용되는 구성 요소를 백그라운드에서 구현합니다.

AT_UI 공식 웹사이트: https://at-ui.github.io/.

8. Vant UI 구성 요소 라이브러리

Vant는 가볍고 안정적인 모바일 Vue 구성 요소 라이브러리입니다. Vant는 Youzan 팀에서 오픈 소스로 제공되며 주로 Youzan 팀에서 유지관리합니다. Vant Weapp은 Youzan의 모바일 구성 요소 라이브러리인 Vant의 미니 프로그램 버전입니다. 둘 다 동일한 시각적 사양을 기반으로 하며 개발자가 미니 프로그램 애플리케이션을 빠르게 구축할 수 있도록 일관된 API 인터페이스를 제공합니다. 지금까지 Vant는 Youzan의 온라인 비즈니스에서 테스트한 50개 이상의 구성 요소를 오픈 소스로 제공했습니다.

예: AddressEdit 주소 편집, AddressList 주소 목록, 지역 및 도시 선택, 카드 카드, 연락처 담당자, 쿠폰 쿠폰, GoodsAction 제품 페이지 액션 포인트, SubmitBar 제출 주문 열, Sku 제품 사양 팝업 레이어. 쇼핑몰을 구축하고 인터페이스와 비즈니스 로직 구현에 크게 신경 쓰지 않는다면 Vant 컴포넌트 라이브러리를 사용하여 빠르게 개발할 수 있습니다.

Vant 공식 웹사이트: https://youzan.github.io/.

9.cube-ui UI 구성 요소 라이브러리

cube-ui는 Vue.js를 기반으로 하는 정교한 모바일 구성 요소 라이브러리입니다. Didi의 내부 구성 요소 라이브러리를 통해 간소화되고 개선되었으며, 각 구성 요소는 후속 통합을 보장할 만큼 충분한 단위 테스트를 거쳤습니다. 최고의 대화형 경험을 추구하세요. 통일된 디자인 상호 작용 표준에 따라 디자인 효과를 크게 복원합니다. 인터페이스가 표준화되고 사용법이 통일되고 표준화되어 개발이 더욱 간단하고 효율적입니다. 온디맨드 도입 및 사후 컴파일을 지원하고 가볍고 유연하며 확장성이 뛰어나며 기존 구성 요소를 기반으로 2차 개발을 쉽게 구현할 수 있습니다.

cube-ui 공식 웹사이트: https://didi.github.io/.

10. Muse-UI UI 구성 요소 라이브러리

Muse-UI는 Vue 2.0의 우아한 Material Design UI 구성 요소 라이브러리를 기반으로 합니다. Muse UI에는 다양한 비즈니스 환경에 적응할 수 있는 40개 이상의 UI 구성 요소가 있습니다. Muse UI에서는 테마 스타일 교체를 완료하는 데 소량의 코드만 필요합니다. Muse UI를 사용하여 복잡한 단일 페이지 응용 프로그램을 개발할 수 있습니다

Muse-UI 공식 웹사이트: https://muse-ui.org/#/zh-CN.

11, N3-comComponents UI 구성 요소 라이브러리

N3 컴포넌트 라이브러리 Vue.js를 기반으로 구축되어 프런트엔드 엔지니어와 풀스택 엔지니어가 페이지와 애플리케이션을 빠르게 구축할 수 있습니다. N3 구성 요소는 60개 이상의 구성 요소, 구성 요소 목록, 사용자 정의 스타일을 갖추고 있으며 다중 모델링 패러다임(UMD)을 지원하고 ES6를 사용하여 개발되었습니다.

N3 공식 웹사이트: https://n3-comComponents.github.

12. Mand Mobile

Mand Mobile은 금융 시나리오를 위한 Vue 모바일 UI 구성 요소 라이브러리로, 풍부하고 유연하며 실용적입니다. 고품질 금융 서비스를 구축하면 복잡한 금융 시나리오가 단순해집니다. Mand Mobile에는 금융 시나리오를 다루는 풍부한 구성 요소와 30개 이상의 기본 구성 요소가 포함되어 있습니다. 매우 사용하기 쉬운 구성 요소에는 자세한 문서와 사례 데모가 포함되어 있으며, 최첨단 기술을 활용하고 구성 요소화 및 경량화를 구현하며 안정성과 품질을 유지하고 재무 시나리오를 완벽하게 다루기 위해 노력합니다.

Mand Mobile 공식 웹사이트: https://didi.github.io/.

13. we-vue UI 컴포넌트 라이브러리

we-vue는 Vue.js 기반의 모바일 컴포넌트 라이브러리 세트입니다. weui. CSS 스타일 라이브러리는 일련의 구성 요소를 캡슐화하며 WeChat 공식 계정과 같은 모바일 개발에 매우 ​​적합합니다. we-vue에는 35개 이상의 구성 요소가 포함되어 있으며 단위 테스트 적용 범위는 98%를 초과하고 babel-plugin-import, 완전한 온라인 문서 및 자세한 온라인 예제를 지원합니다.

we-vue 공식 웹사이트: https://wevue.org/.

14. veui UI 컴포넌트 라이브러리

veui는 Baidu EFE 팀에서 개발한 Vue 엔터프라이즈급 UI 컴포넌트 라이브러리입니다. 현재 문서는 없고 데모만 있습니다. GitHub에서는 진행 중인 작업이라고 말합니다. 그럼 인내심을 가지고 기다리자.

veui 공식 웹사이트: https://ecomfe.github.io/.

15. Semantic-UI-Vue UI 구성 요소 라이브러리

Semantic-UI-Vue는 Vue 기반의 Semantic-UI 프레임워크 구현입니다. .js Semantic은 개발자가 인간 친화적인 HTML 언어를 사용하여 우아한 반응형 레이아웃을 구축할 수 있도록 지원하는 개발 프레임워크입니다. Semantic-UI-Vue는 Semantic-UI와 유사한 API와 사용자 정의 가능한 테마 세트를 제공합니다.

Semantic-UI-Vue 공식 웹사이트: https://semantic-ui-vue.github.

16, vue-beauty

vue-beauty는 vue.js 및 ant-design 스타일을 기반으로 한 PC 클라이언트입니다. 개발자가 제품 경험과 개발 효율성을 향상하고 유지 관리 비용을 절감할 수 있도록 설계된 UI 구성 요소 라이브러리입니다. vue-beauty에는 vue 구성 요소 개발, 데이터 기반 보기, 복잡성 캡슐화, 간단하고 친숙한 API 제공 및 Ant 디자인 스타일 최적화를 기반으로 하는 일반적인 시나리오를 다루는 풍부한 구성 요소가 포함되어 있습니다.

vue-beauty 공식 홈페이지: https://fe-driver.github.io/.

17. NutUI 컴포넌트 라이브러리

NutUI는 모바일 웹 인터페이스를 개발하고 서비스하는 JD 스타일의 모바일 Vue 컴포넌트 라이브러리입니다. 레벨 프론트, 미들, 백엔드 제품. NutUI 구성 요소 라이브러리는 크로스 플랫폼을 지원하고 WeChat 애플릿 구성 요소로 자동 변환됩니다(나중에 출시될 예정이므로 계속 지켜봐 주시기 바랍니다). 30개 이상의 JD 모바일 터미널 프로젝트에서 사용되고 있습니다. JD APP 7.0 시각적 사양을 기반으로 하며 주문형 지원을 제공합니다. 로딩, 상세한 문서 및 예제를 갖추고 있으며, 맞춤형 테마 지원, 다국어(국제화) 지원, TypeScript 지원, 서버사이드 렌더링(Vue SSR) 지원, 유닛 테스트 지원, Webpack 기반 구축 도구를 갖추고 있습니다. 이 구성 요소 라이브러리가 내장되어 Vue 프로젝트를 빠르게 만들 수 있습니다.

NutUI 공식 홈페이지: https://nutui.jd.com/#/index.

프레임워크를 선택할 때는 실제 웹 개발 상황과 팀의 친숙도를 바탕으로 선택해야 합니다. 좋은 UI 구성 요소 라이브러리는 웹 프로젝트에 너무 중요합니다. 좋은 UI 구성 요소 라이브러리는 절반의 노력으로 두 배의 결과를 얻을 수 있습니다.

관련 추천: "vue.js Tutorial"

위 내용은 vuejs 모바일 터미널에는 어떤 UI 프레임워크가 사용됩니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!