Verfügbare UI-Frameworks für vuejs; , Cube-UI; 10, Muse-UI usw.
Die Betriebsumgebung dieses Tutorials: Windows 7-System, Vue-Version 2.9.6, DELL G3-Computer.
Vue ist eine leichte, leistungsstarke, komponentenfähige MVVM-Bibliothek mit einer einfachen und übersichtlichen API, die einen schnellen Einstieg ermöglicht. Seit seiner Einführung wurde Vue von vielen Webentwicklern anerkannt. Bei der Web-Front-End-Projektentwicklung des Unternehmens werden mehrere Projekte mithilfe des Vue-basierten UI-Komponenten-Frameworks entwickelt und offiziell verwendet. Nach der Verwendung des Vue.js-Frameworks und der UI-Komponentenbibliothek wurde die Entwicklungseffizienz des Entwicklungsteams erheblich verbessert, es muss weniger Code schreiben und viele Schnittstelleneffektkomponenten wurden gekapselt.
Bei der Auswahl der Vue UI-Komponentenbibliothek haben wir auch einige hervorragende Vue UI-Komponentenbibliotheken gesammelt und zusammengestellt, basierend auf Faktoren wie der Anzahl der Sterne, der Dokumentvielfalt, der Häufigkeit von Aktualisierungen und der Wartung auf GitHub.
iView ist eine Reihe von Open-Source-UI-Komponentenbibliotheken auf Basis von Vue.js, die hauptsächlich Mid- und Back-End-Produkte für PC-Schnittstellen bedienen. Die Komponenten von iView sind relativ vollständig, lassen sich schnell aktualisieren und die Dokumentation ist sehr detailliert. Es wird vom Unternehmensteam verwaltet und ist ein relativ zuverlässiges Vue-UI-Komponenten-Framework
. Das iView-Ökosystem läuft ebenfalls sehr gut und es gibt auch einen Open-Source-iView-Administrator, der für Backend-Arbeiten sehr praktisch ist. Laut der offiziellen Website wurde iView in Produkten großer Unternehmen wie TalkingData, Alibaba, Baidu, Tencent, Toutiao, JD.com, Didi Chuxing, Meituan, Sina, Lenovo und anderen großen Unternehmen verwendet.
Offizielle Website von iView: https://www.iviewui.com/.
Vux ist eine mobile UI-Komponentenbibliothek, die auf Basis von WeUI und Vue2.x entwickelt wurde und hauptsächlich WeChat-Seiten bedient. Die Positionierung von Vux ist sehr klar: Die mobile UI-Komponentenbibliothek von Vue und die grundlegende Stilbibliothek von WeUI. Die Komponenten von Vux decken alle WeUI-Inhalte ab und erweitern auch einige häufig verwendete Komponenten. Zum Beispiel: Sticky, Timeline, V-Chart, XCircle.
Vux wird von Einzelpersonen gepflegt. Aber der Stern auf GitHub steht immer noch sehr hoch und erreicht 13.000. Ich habe gesehen, dass das Problem auf GitHub sehr schnell behoben wurde. Die grundlegende Komponentenverwendung und die Auswirkungen des Vux-Dokuments werden vor Ort erläutert.
Viele Vux-Anwendungsfälle werden auch auf der offiziellen Vux-Website angezeigt. Bei der Entwicklung von WeChat-Seiten gibt es grundsätzlich nicht zu viele Fehler und die Entwicklung verläuft relativ reibungslos.
Vux offizielle Website: https://vux.li/.
Element, eine Reihe von Desktop-Komponentenbibliotheken basierend auf Vue 2.0 für Entwickler, Designer und Produktmanager.
Element ist eine Vue-UI-Komponentenbibliothek, die vom Open-Source-Frontend von Ele.me verwaltet wird. Die Aktualisierungshäufigkeit ist immer noch sehr hoch und eine neue Version wird grundsätzlich jede Woche bis jeden halben Monat veröffentlicht. Die Komponenten sind vollständig und decken grundsätzlich alle vom Backend benötigten Komponenten ab. Die Dokumentation erklärt ausführlich und es gibt viele Beispiele. Ich habe es noch nie in der Praxis verwendet. Es gibt viele Element-Tutorials und Artikel im Internet.
Element sollte eine relativ hochwertige Vue UI-Komponentenbibliothek sein.
Offizielle Website von Element: http://element.eleme.io/#/zh-CN.
Mint UI ist eine mobile Komponentenbibliothek basierend auf Vue.js, ebenfalls von Ele .me Frontend-Projekte. Bei Mint UI geht es wirklich darum, Komponenten bei Bedarf zu laden. Sie können nur deklarierte Komponenten und deren Stildateien laden. Mint UI verwendet CSS3, um verschiedene Animationen zu verarbeiten, um unnötiges Neuzeichnen und Umfließen des Browsers zu vermeiden und den Benutzern ein reibungsloses und reibungsloses Erlebnis zu ermöglichen.
Viele der Online-Video-Tutorials basieren auf der Mint-Benutzeroberfläche. Es ist sehr praktisch, mobile Webprojekte zu entwickeln, und die Dokumentation ist auch sehr prägnant und klar. Viele Seiten-Mint-UI-Komponenten wurden gekapselt. Sie können sie grundsätzlich gemäß den Beispielen schreiben und mit einfachen Anpassungen implementieren.
Die letzte Code-Einreichung auf GitHub erfolgte jedoch am 16. Januar 2018, also vor einem halben Jahr. Ich weiß nicht, ob das Projekt relativ stabil ist und nicht aktualisiert wurde oder ob das Projekt möglicherweise aufgegeben wird. Wir werden weiterhin auf die Dynamik der Mint-Benutzeroberfläche achten.
Offizielle Website von Mint UI: http://mint-ui.github.io/.
Bootstrap-VUE bietet die Implementierung von Bootstrap V4-Komponenten und einem Grid-System basierend auf vue2 , komplett mit umfangreichem und automatisiertem WAI ARA-Markup zur Barrierefreiheit. uiv ist eine Bootstrap 3-Implementierung basierend auf Vue2. Bootstrap 4 ist die neueste Version. Im Vergleich zu Bootstrap 3 verfügt es über spezifischere Klassen und wandelt einige verwandte Teile in verwandte Komponenten um. Gleichzeitig wurde die Größe von Bootstrap.min.css um mehr als 40 % reduziert.
Bootstrap4 hat die Unterstützung für IE8 und iOS 6 aufgegeben und unterstützt jetzt nur noch IE9 und höher sowie iOS 7 und höher. Als responsive Websites zum ersten Mal populär wurden, war Bootstrap das weltweit beliebteste Framework für die Erstellung mobiler Websites. Man kann sagen, dass Bootstrap auf der ganzen Welt beliebt war.
Schon jetzt reagieren viele Unternehmenswebsites mithilfe von Bootstrap. Mit Bootstrap-Vue können Sie Bootstrap-Effekte in Vue erzielen.
Offizielle Website von Bootstrap-Vue: https://bootstrap-vue.js.org/
Offizielle Website von uiv: https://uiv.wxsm.space/.
Ant Design Vue ist die Vue-Implementierung von Ant Design 3.X, die für Backend-Produkte auf Unternehmensebene entwickelt und bereitgestellt wird. Mehrere Ant Design Vue-Komponenten finden Sie auf GitHub. Im Vergleich ist Ant Design Vue jedoch besser.
Ant Design Vue teilt das Ant Design of React-Designtoolsystem, implementiert alle Ant Design of React-Komponenten und unterstützt moderne Browser sowie IE9 und höher (erfordert Polyfills). Es ermöglicht denjenigen, die mit Ant Design vertraut sind, einen einfachen Einstieg in die Verwendung von Vue.
Offizielle Website von Ant Design Vue: https://vuecomponent.github.
AT-UI ist eine Front-End-UI-Komponentenbibliothek, die hauptsächlich auf Vue.js 2.0 basiert Wird für die schnelle Entwicklung von Mid- und Back-End-Produkten für PC-Websites verwendet und unterstützt moderne Browser sowie IE9 und höher. AT-UI ist schlanker und implementiert häufig verwendete Komponenten im Hintergrund.
Offizielle Website von AT_UI: https://at-ui.github.io/.
Vant ist eine leichte und zuverlässige mobile Vue-Komponentenbibliothek. Vant ist eine Open-Source-Lösung des Youzan-Teams und wird hauptsächlich vom Youzan-Team gepflegt. Vant Weapp ist eine Miniprogrammversion von Vant, einer mobilen Komponentenbibliothek von Youzan. Beide basieren auf den gleichen visuellen Spezifikationen und bieten konsistente API-Schnittstellen, um Entwicklern die schnelle Erstellung von Miniprogrammanwendungen zu erleichtern. Bisher verfügt Vant über mehr als 50 Open-Source-Komponenten, die vom Online-Unternehmen Youzan getestet wurden.
Zum Beispiel: AddressEdit-Adressbearbeitung, AddressList-Adressliste, Auswahl der Region, Provinz und Stadt, Kartenkarte, Kontaktperson, Coupon-Coupon, GoodsAction-Produktseiten-Aktionspunkt, SubmitBar-Einreichungsauftragsspalte, SKU-Produktspezifikations-Popup-Ebene. Wenn Sie ein Einkaufszentrum bauen und sich nicht viel um die Schnittstelle und die Implementierung der Geschäftslogik kümmern, können Sie mithilfe der Vant-Komponentenbibliothek schnell entwickeln.
Vant offizielle Website: https://youzan.github.io/.
cube-ui ist eine exquisite mobile Komponentenbibliothek, die auf Vue.js basiert. Es wurde aus der internen Komponentenbibliothek von Didi optimiert und verfeinert und hat mehr als ein Jahr Geschäftstests durchlaufen. Jede Komponente verfügt über ausreichende Unit-Tests, um eine Garantie für die spätere Integration zu bieten. Streben Sie nach dem ultimativen interaktiven Erlebnis. Durch die Einhaltung einheitlicher Design-Interaktionsstandards wird der Designeffekt stark wiederhergestellt; die Schnittstelle ist standardisiert und die Verwendung ist einheitlich und standardisiert, was die Entwicklung einfacher und effizienter macht. Es unterstützt die bedarfsgesteuerte Einführung und Nachkompilierung, ist leichtgewichtig und flexibel und kann problemlos eine Sekundärentwicklung auf der Grundlage vorhandener Komponenten implementieren.
cube-ui offizielle Website: https://didi.github.io/.
Muse-UI basiert auf der eleganten Material Design UI-Komponentenbibliothek von Vue 2.0. Muse UI verfügt über mehr als 40 UI-Komponenten zur Anpassung an verschiedene Geschäftsumgebungen. Für die Muse-Benutzeroberfläche ist nur eine kleine Menge Code erforderlich, um den Austausch des Designstils abzuschließen. Muse UI kann zum Entwickeln komplexer Einzelseitenanwendungen verwendet werden. Offizielle Website von Muse-UI: https://muse-ui.org/#/zh-CN.
11, N3-components UI-Komponentenbibliothek N3-Komponentenbibliothek Es basiert auf Vue.js und ermöglicht Front-End-Ingenieuren und Full-Stack-Ingenieuren die schnelle Erstellung von Seiten und Anwendungen. N3-Komponenten verfügen über mehr als 60 Komponenten, eine Komponentenliste und benutzerdefinierte Stile, unterstützen mehrere Modellierungsparadigmen (UMD) und werden mit ES6 entwickelt.12, Mand Mobile
Mand Mobile ist eine Vue-Mobile-UI-Komponentenbibliothek für Finanzszenarien. Sie ist umfangreich, flexibel und praktisch und kann schnell ausgeführt werden Erstellen Sie hochwertige Finanzdienstleistungen. Produkte wie diese machen komplexe Finanzszenarien einfach. Mand Mobile enthält umfangreiche Komponenten und über 30 Basiskomponenten, die finanzielle Szenarien abdecken. Die äußerst benutzerfreundlichen Komponenten verfügen alle über eine detaillierte Dokumentation und Falldemonstrationen. Es basiert auf modernster Technologie, implementiert die Komponentisierung und berücksichtigt die Stabilität und Qualität und strebt eine vollständige Abdeckung finanzieller Szenarien an.13. we-vue UI-Komponentenbibliothek
we-vue ist eine mobile Komponentenbibliothek basierend auf Vue.js, kombiniert mit weui. Die CSS-Stilbibliothek kapselt eine Reihe von Komponenten und eignet sich sehr gut für die mobile Entwicklung wie offizielle WeChat-Konten. we-vue enthält mehr als 35 Komponenten, eine Unit-Test-Abdeckung von über 98 %, unterstützt den Babel-Plugin-Import, eine vollständige Online-Dokumentation und detaillierte Online-Beispiele.14. veui UI-Komponentenbibliothek
veui ist eine Vue-UI-Komponentenbibliothek auf Unternehmensebene, die vom Baidu EFE-Team entwickelt wurde. Derzeit gibt es keine Dokumentation, nur eine Demo. GitHub sagt, dass es sich um eine laufende Arbeit handelt. Dann lasst uns geduldig warten.15. Semantic-UI-Vue UI-Komponentenbibliothek
Semantic-UI-Vue ist eine Implementierung des Semantic-UI-Frameworks basierend auf Vue .js. Semantic ist ein Entwicklungsframework, das Entwicklern dabei hilft, elegante, responsive Layouts mithilfe einer benutzerfreundlichen HTML-Sprache zu erstellen. Semantic-UI-Vue bietet eine API ähnlich der Semantic-UI und eine Reihe anpassbarer Themen.16, vue-beauty
vue-beauty ist ein PC-Client, der auf vue.js und dem Ant-Design-Stil basiert UI-Komponentenbibliothek, die Entwickler dabei unterstützen soll, das Produkterlebnis und die Entwicklungseffizienz zu verbessern und die Wartungskosten zu senken. vue-beauty enthält eine Fülle von Komponenten, die gängige Szenarien abdecken, basierend auf der Entwicklung von Vue-Komponenten, datengesteuerten Ansichten, der Kapselung von Komplexität, der Bereitstellung einer einfachen und benutzerfreundlichen API und der Optimierung des Ant-Designstils.vue-beauty offizielle Website: https://fe-driver.github.io/.
NutUI ist eine mobile Vue-Komponentenbibliothek im JD-Stil, die mobile Webschnittstellen für Unternehmen entwickelt und bereitstellt. Ebene Front-, Middle- und Back-End-Produkte. Die NutUI-Komponentenbibliothek unterstützt plattformübergreifend, konvertiert automatisch in WeChat-Applet-Komponenten (wird später gestartet, bleiben Sie also auf dem Laufenden), wird von über 30 JD-Mobilterminalprojekten verwendet, basiert auf den visuellen Spezifikationen von JD APP 7.0 und unterstützt bei Bedarf Es wird geladen und verfügt über eine detaillierte Dokumentation und Beispiele. Es unterstützt benutzerdefinierte Themen, unterstützt Mehrsprachigkeit (Internationalisierung), unterstützt TypeScript, unterstützt serverseitiges Rendering (Vue SSR), Unterstützung für Unit-Tests und ist mit einem auf Webpack basierenden Konstruktionstool ausgestattet. Mit dieser integrierten Komponentenbibliothek kann schnell ein Vue-Projekt erstellt werden.
Offizielle NutUI-Website: https://nutui.jd.com/#/index.
Bei der Auswahl eines Frameworks müssen Sie es basierend auf der tatsächlichen Webentwicklungssituation und der Vertrautheit des Teams auswählen. Eine gute UI-Komponentenbibliothek ist für ein Webprojekt zu wichtig. Eine gute UI-Komponentenbibliothek kann mit halbem Aufwand das Doppelte des Ergebnisses erzielen.
Verwandte Empfehlungen: „vue.js Tutorial“
Das obige ist der detaillierte Inhalt vonWelches UI-Framework wird für das mobile Endgerät von vuejs verwendet?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Die übergeordnete Vue-Komponente ruft die Methode der untergeordneten Komponente auf
vue v-wenn
Der Unterschied zwischen vue2.0 und 3.0
So übergeben Sie einen Wert an die Vue-Komponente
Der Unterschied zwischen vue3.0 und 2.0
Vue allgemeine Anweisungen
Was sind die am häufigsten verwendeten Anweisungen in Vue?
Welche Methoden gibt es zum Erstellen einer mobilen Website?
