数分でフォームを作成します.


こんにちは.
フォームを作成するための新しいライブラリを使用しています.
フォームを作成するには、2つの簡単な手順を実行する必要があります.
  • フォームデータの検証とプロパティを記述するスキームを定義します.
  • メソッドを使用してスキームをUIコンポーネントに接続します.
  • スキーム


    // scheme.js
export default {
        valid: null,
        formValue: {
            first_name: "",
            last_name: "",
        },
        rules: {
            first_name: [
                ["empty", "please write your first name"]
            ],
            last_name: [
                ["empty", "please write your last name"]
            ]
        }
    }
    
    

    フォーム


    //MyForm.ts
    import {useFormMod} from "formmod";
    
    export const MyForm = () => {
    const {setValue, getValue, getError, validate} = useFormMod(
            FORM_SCHEME
     );
    
    return (
    <form onSubmit={handlerSubmit}>
    …
          <MyTextInput
               label={"First name"}
               value={getValue("first_name")}
               error={getError("first_name")}
               onChange={(value: string) => setValue("first_name", value)}
          />
    … 
    </form>
    );
    
    完全なドキュメント
    https://doc.formmod.org/
    *私たちは読書用のラップトップまたはデスクトップデバイスを使用することをお勧めします
    ドキュメント.
    長所

  • 依存関係はありません.これが単純な仕事の力だ.このフォームシステムは、コンポーネント、JSX、あなたのアプリケーション、ストアについて知りません.もはやJAPXの構文を理解するラッパーのコンポーネントを作成する必要があります.だけで何かを使用します.

  • 簡単なシステム、簡単なコード.それは非常に簡単です.

  • 時間を節約できます.ちょうどプロパティをコンポーネントに接続します.
  • In addition to validation and simple things, the system supports optional, group fields in the form and much more. Just read documentation.
  • サポートのために、ちょうど私達のgithubページ(星)に星を設定します.
    https://github.com/nickorsk2017/formMOD
    このシステムについてどう思いますか.
    ありがとう!