I 10 migliori componenti Vue Form per la tua app Vue

Blog

I 10 migliori componenti Vue Form per la tua app Vue

Il componente Vue Form è uno strumento che ti aiuta a risolvere il problema di consentire agli utenti finali di interagire con i dati e modificare i dati nella tua applicazione.
In questo articolo ti presenterò 11 componenti del modulo Vue che trovo molto utili.



1. Vuetify-Form-Base

vuetify-form-base è un componente Vue e può essere facilmente integrato in qualsiasi progetto Vue.

L'oggetto-schema ha la stessa struttura dell'oggetto-valore. Crea uno schema clonando l'oggetto valore e sostituisci i valori dell'oggetto dati con le definizioni per il tuo schema. Il corrispondente Schema-Oggetto definisce il tipo, il layout e il comportamento funzionale del tuo Form.



Caratteristiche

  • Vue-Component
  • integra il framework dell'interfaccia utente Vuetify con layout reattivo e supporto di Grid
  • Usa molti tipi di controllo e input Vuetify inclusi gli API-Props disponibili
  • Ottieni moduli completamente configurabili basati sulla definizione dello schema
  • Modifica oggetti nidificati semplici o profondi, inclusi gli array, senza la necessità di appiattirli
  • Ottieni un risultato reattivo completo
  • Ascolta gli eventi 'Ridimensiona', 'Messa a fuoco', 'Inserisci', 'Fai clic', 'Scorri' e 'Aggiorna'
  • Usa gli slot per passare intestazione e piè di pagina in un controllo. O sostituire un controllo per slot
  • Stile CSS configurabile

Vuetify-Form-Base



Dimostrazione

Scarica

matrice numpy di copia profonda

2. ModuloVuelar

FormVuelar è un insieme di componenti di moduli vue predefiniti progettati per visualizzare automaticamente gli errori di ritorno dal tuo backend. Funziona immediatamente con il messaggio di errore che viene restituito da Laravel quando si invia un modulo ajax.

ModuloVuelar

Dimostrazione

Scarica


3. vue-form-components

Elementi del modulo vue puliti e minimi con convalida.

vue-form-components

Dimostrazione

Scarica


Quattro. esempio-elenco-form

Moduli dinamici che utilizzano Vue.js.

esempio-elenco-form

Scarica


5. vue-genesis-forme

Facile creazione di moduli in Vue.js

vue-genesis-forme

Dimostrazione

Scarica


6. FormBuilder

Laravel Enso Form Builder è un creatore di moduli personalizzabile basato su modelli, in modo da poter creare rapidamente moduli con il minimo sforzo

FormBuilder

Dimostrazione

Scarica


7. vfg-field-array

Un campo generatore di vue-form per gestire gli array.

vfg-field-array

Scarica


8. vue-formbuilder2.0

Generatore di moduli ElementUI.

Il codice di base è stato clonato da https://github.com/jmeei/vue-formbuilder , e alcuni sono migliorati.

vue-formbuilder2.0

Dimostrazione

Scarica


9. vue-interactive-paycard

Un fantastico modulo di carta di credito con micro-interazioni fluide e dolci. Include la formattazione del numero, la convalida e il rilevamento automatico del tipo di carta. Costruito con vuejs e anche completamente reattivo.

vue-interactive-paycard

Dimostrazione

Scarica


10. vue-dynamic-form-component

vue-dynamic-form-component è un componente di form dinamico basato su element-ui e async-validator. Hai solo bisogno di scrivere descrittori (riferimento a async-validator) dei dati che desideri, vue-dynamic-form-component genererà automaticamente il modulo.

vue-dynamic-form-component

Dimostrazione

Scarica


Grazie per aver letto!

# vue-js # vue-form # vue-form-component # form-component

amazon sde 2 domande di intervista