Fermer

septembre 13, 2018

Quoi de neuf pour React dans la version R3 2018 de l'interface utilisateur Kendo


Découvrez les dernières mises à jour de la version R3 2018 de Kendo UI pour React, y compris de nouveaux composants natifs, des visualisations et bien plus encore.

Nous avons eu deux mois très occupés ici sur le React côté de la maison Kendo UI . Avec un énorme ensemble de nouveaux composants en cours de publication, ainsi que des fonctionnalités importantes ajoutées aux composants existants, je voulais prendre du temps au-delà de l'article que vous aviez peut-être déjà lu. for React!

Nouveaux composants d'interface utilisateur natifs pour React

En commençant par les nouveaux composants, regardons simplement chaque nouveau widget:

Menu

 react-menu "title =" react-menu " /></p data-recalc-dims=

Ce widget de menu est parfait pour créer une navigation de site ou pour fournir une fenêtre contextuelle contenant des options pour les autres éléments de l'interface utilisateur sur votre page.

MultiViewCalendar

 react-multiview -calendar "title =" react-multiview-calendar "/></p data-recalc-dims=

Le widget MultiViewCalendar fournit deux calendriers côte à côte (affichant souvent deux mois différents) pour donner aux utilisateurs un moyen intuitif de gérer les plages de dates ou sélection des dates tout en donnant une vue plus grande.

DateRangePicker

 react-date-range-picker "title =" react-date-range-picker "/></p data-recalc-dims=

En se basant sur MultiViewCalendar, le DateRangePicker permet aux développeurs de collecter des dates de début et de fin dans un seul composant. Plus besoin de configurer deux DatePickers et de définir manuellement la plage!

MultiSelect

 react-multiselect "title =" react-multiselect "/></p data-recalc-dims=

Le nom le donne, mais pour les scénarios où vos utilisateurs ont besoin pour saisir plusieurs valeurs prédéfinies à partir d'une liste, le composant MultiSelect pour React est la solution idéale.

Tooltip

 react-tooltip "title =" react-tooltip "/> [19659019] La Tooltip </a data-recalc-dims= peut être attachée à n'importe quel élément HTML de base, ainsi que des composants plus avancés tels que nos widgets natifs React UI.

Dialog

 react-dialog "title =" react-dialog "/> [19659022] Chaque fois qu’une invite avec des actions spécifiques (oui / non ou accepter / annuler, par exemple) doit être affichée dans une fenêtre contextuelle modale, <a href= le composant Dialogue est le choix idéal. Le contenu peut être personnalisé par des chaînes simples. ou personnalisé par le biais de nos options de configuration.

Nouvelles mises à jour de la bibliothèque de visualisation des données

The Data Visualiz

Sparkline Chart

 react-sparkline "title =" react-sparkline "/></p data-recalc-dims=

L'image ci-dessus est extraite directement de nos démonstrations et montre comment La carte graphique peut facilement être ajoutée à un paragraphe et mélanger sans effort avec du texte. Un autre cas d'utilisation important serait d'ajouter ceci à une colonne d'une grille.

Stock Chart

 react-stock-chart "title =" react-stock-chart "/></p data-recalc-dims=

Les données financières constituent une grande partie de toute application professionnelle, et souvent cela nécessite un ensemble spécifique de marqueurs et d'interactions quand il s'agit de graphiques. Heureusement, le nouveau composant React Stock Chart vous a couvert!

Jauges

 react-gauges " title = "react-jauges" /></p data-recalc-dims=

Choisissez entre nos jauges Linear Radial ou Arc image ci-dessus) pour fournir une visualisation de données unique pour vos applications. Tous ces types sont intégrés au nouveau composant React Gauge .

Nouveaux composants de React

Outre les nouveaux composants, nous avons ajouté certaines des fonctionnalités les plus recherchées. pour l'ensemble existant de composants natifs de React UI.

La grille a reçu de grandes mises à jour en termes de fonctionnalités et de modifications sous-jacentes.

Grâce à nos éléments d'entrée, souvent utilisés pour les formulaires, nous avons Validation du formulaire HTML5 . Cela peut être vu sur les pages de composants individuels, comme celui-ci pour notre composant DateInput .

Le widget Calendrier a également reçu la possibilité de masquer sa navigation et configure la profondeur de la vue du calendrier via des options de configuration simples.

Mises à jour de la documentation

Bien que cela ne soit perceptible que par les utilisateurs existants de React, nous avons organisation d'articles de documentation. Une fois que vous plongez dans un composant, vous verrez que le menu sur le côté gauche est plus intuitif pour naviguer, avec des indications claires sur le moment où une sous-section existe. Cela a également contribué à la performance globale de l'application lorsque vous naviguez dans toutes les options disponibles. Regardez-le en allant sur notre page React Components et en sélectionnant votre composant préféré!

J'ai des commentaires?

Je dis toujours ça, mais je veux savoir ce que vous pensez de cette version! Avez-vous raté votre composant préféré? Des fonctionnalités que vous souhaitez voir ajoutées aux composants existants? Vous pouvez poster dans la section commentaire ci-dessous, ou voter et / ou soumettre des éléments sur notre portail de commentaires publics . Les commentaires que nous recevons de nos utilisateurs pilotent notre feuille de route, donc si vous voulez voir quelque chose ajouté dans une prochaine version, faites entendre votre voix!

Rejoignez-nous pour le webinaire en direct!

mais si vous voulez voir tous ces faits saillants et plus encore, vous devriez vous joindre à nous pour le LIVE Webinar Kendo UI qui se tiendra le 27 septembre à 11 h HE! L'équipe UI Developer Advocate dans un webinaire en direct où nous vous présenterons la version R3 2018 de toutes les versions de Kendo UI! Les sièges sont limités, alors assurez-vous de réserver le vôtre dès aujourd'hui!

Save My Seat


Les commentaires sont désactivés en mode de prévisualisation.




Source link