フォーム・コンポーネントの選択

どのフォーム・コンポーネントがアプリケーションに適しているかを判断することが難しい場合があります。フォーム・コンポーネントおよびJSONスキーマ・フォーム・コンポーネントの機能は似ていますが、選択する際に、いくつかの検討要素があります。

決定後、各コンポーネントの使用方法については、以下のドキュメントを参照してください。


シンプルさ

フォーム・コンポーネントは、Retoolの通常のコンテナー・コンポーネントと同様に機能します。フォーム・コンポーネントの中に、他のコンポーネント(入力項目やドロップダウンなど)をドラッグ・アンド・ドロップできます。コンテナーと違って、フォーム・コンポーネントには、送信ボタンや送信後にフォームをクリアする機能など、追加のヘルパーがあります。フォーム・コンポーネントにテキスト入力をドラッグ・アンド・ドロップすることが、フォームの作成を始める最も簡単な方法です。

レイアウト

フォーム・コンポーネントでは、ドラッグ・アンド・ドロップ操作をサポートしているため、複数の列、コンテナー内のサブセクションなどを好きなようにフォームに配置できます。どのRetoolコンポーネントもフォーム・コンポーネント内にドラッグできます。これにより、インライン・ノートやイメージなどを容易に追加できます。

一方で、JSONスキーマ・フォーム( English )・コンポーネントがサポートしているのは、1列のレイアウトのみです。入力項目を並べ替えたり、入力タイプを変更したりするには、JSONコードを編集する必要があり、ドラッグ・アンド・ドロップ操作は使用できません。これはカスタム・レイアウトには適していませんが、変更する際に、手動でフォームを再配置する必要がありません。JSONを変更すると、フォームのレイアウトが自動的に更新されます。

柔軟性

JSONスキーマ・フォーム・コンポーネントは、react-jsonschema-formライブラリーに基づいています。これは多数の機能と柔軟性を備えていますが、構文を習得するのが難しいという短所があります。複数の相互依存フィールドに応じた検証など、通常のフォーム・コンポーネントで容易にプログラミングできないものが、JSONスキーマ・フォームで可能になる場合があります。

さらに、他の製品では、JSONスキーマベースのフォームを使用しているチームもあります。JSONスキーマ・コンポーネントを使用すると、スキーマのバージョンを集中管理したり、Retoolに直接組み込んで、最新かつ一貫性を保持したりすることができます。

詳細は、react-jsonschema-formのドキュメントを参照してください。

まとめ

単純なフォームがある場合、またはフォームのレイアウトをカスタマイズする必要がある場合は、通常のフォーム・コンポーネントを使用することをお勧めします。手動でのフォームのレイアウトの処理や高度な機能が不要で、react-jsonschema-formライブラリーに関する知識を習得することに抵抗がない場合は、JSONスキーマ・フォームが最適です。

以下に、参考のための早見表を示します。

フォームJSONスキーマ・フォーム
フォームのレイアウトドラッグ・アンド・ドロップ、完全カスタム自動、1列
フォームのプロパティと検証の編集個々の入力を使用JSONコードを使用
SQLデータベース・スキーマを使用したフォームの自動生成拡張基本
他のRetoolコンポーネントの受け入れ可(コンテナーと同様)不可