Installer et afficher avec React

Pour une nouvelle application web, suivez le démarrage rapide. Le projet React et Vite maintenu inclut le binding, sa configuration et des schémas d’exemple.

Pour ajouter form0 à une application existante :

Code
npm install form0-react form0-core

L’application hôte doit aussi fournir des dépendances peer compatibles :

• Node.js 22 ou plus récent pour l’installation et les outils de build
• React 18 ou 19
• React DOM 18 ou 19
• @vanilla-extract/css 1.17.4 ou plus récent

Afficher un schéma

Code
import { FormRenderer } from "form0-react"
import "form0-react/index.css"
import schema from "./contact.form0.json"

export function ContactForm() {
  return (
    <FormRenderer
      schema={schema}
      onSubmit={(record, meta) => {
        console.log(record)
        console.log(meta.rawValues)
      }}
    />
  )
}

schema doit contenir un objet formulaire form0-core valide. Commencez par Modifier votre premier schéma ou consultez Objet formulaire.

onSubmit reçoit un enregistrement form0 structuré. Le second argument fournit les valeurs brutes, l’état répétable, les horodatages et le résumé de validation. Consultez Valeurs, instantanés et soumission.

[!NOTE] FormRenderer exécute par défaut le moteur sur le thread principal. Une application Vite peut utiliser le worker fourni avec engineMode="worker".