JavaScript

Vuetify 2.0

Vuetify 2.0 veröffentlicht: Neues Grid nach Bootstrap-Vorbild
Keine Kommentare

Arcadia ist da! Das ist der Name des 2. Major-Release von Vuetify, der Material-Design-Library für Vue.js. Mit Arcadia hat nun auch Vuetify die neue Version der Material-Design-Guidelines implementiert. Außerdem hat man an der Accessibility, dem Grid-System und vielen weiteren Aspekten gearbeitet.

Vuetify ist ein Framework für Vue.js, das die Entwicklung von Anwendungen durch das Bereitstellen von Komponenten vereinfachen soll. Dabei setzt Vuetify auf das noch immer beliebte Material Design von Google, das mit dem Release von Vuetify 2.0 „Arcadia“ ebenfalls in v2.0 in die Library integriert wurde. Neben diesem Update der zugrunde liegenden Designsprache bringt die neue Version noch zahlreiche weitere Änderungen mit. Zu den neuen Komponenten in der Version gehört die VAppBar, die den Funktionsumfang der bisherigen v-toolbar erweitern soll. In der neuen Version sind damit nun unter anderem einklappbare Menü-Leisten umsetzbar. Neu ist außerdem die Komponente VBanner, die aus dem Material Design 2 stammt. Auch einen Color-Picker bringt Vuetify 2.0 mit.

Vuetify 2.0: Alles neu im Release?

Einige weitere Features haben nur ihr Verhalten verändert, nicht aber ihre eigentliche Funktion. So verspricht das Lazy Loading von fünf Komponenten eine bessere Performance. Dies betrifft v-badge, v-menu, v-tooltip, v-dialog und v-bottom-sheet. Außerdem stellt der dunkle Modus, bislang über ein Property repräsentiert, nun ein eigenes Theme dar. Über die Option $vuetify.theme.dark kann die Theme-Wahl dynamisch gestaltet werden.

JavaScript Days 2019

JavaScript Testing in der Praxis (Teil 1 + 2)

mit Dominik Ehrenberg (Crosscan) und Sebastian Springer (MaibornWolff)

Fortgeschrittene schwarze Magie in TypeScript

mit Peter Kröner (‚Webtechnologie-Erklärbär‘)

Beeinflusst wurde Vuetify 2.0 außerdem von Bootstrap: Das Grid in Vuetify wurde nach dem Vorbild von Bootstrap neu gebaut. Zwar funktioniere die alte Version grundsätzlich noch, der Code müsse aber stellenweise angepasst werden um v2 zu nutzen, wie den Release Notes auf GitHub entnommen werden kann. Geändert wurde daran nicht nur das Interval der Spacing Helpers, die nun mit 4px-Schritten arbeiten, sondern auch die Benennung vieler Helper.

Weitere Informationen zu Vuetify 2.0 können den Release Notes auf GitHub entnommen werden.

Unsere Redaktion empfiehlt:

Relevante Beiträge

Hinterlasse einen Kommentar

Hinterlasse den ersten Kommentar!

avatar
400
  Subscribe  
Benachrichtige mich zu:
X
- Gib Deinen Standort ein -
- or -