0

以下のパッケージを使用してフォームを動的に生成しています。

https://www.npmjs.com/package/react-formio

login-formこのリンクを使用し て単純なものを生成しましたhttps://codesandbox.io/s/cra-react-formio-iy8lz

ビルド後、JSON を作成します。次に、その JSON を使用してフォームを生成します。

期待どおりに同じフォームを作成しますが、ユーザーが自分のユーザー ID/ファーストネーム/ファーストフィールドを入力したときにのみパスワードフィールドを表示したい

https://codesandbox.io/s/brave-smoke-07qyi

ReactDOM.render(
  <Form
    src={{
      _id: "5b8c14217f43cc293958e2bc",
      type: "form",
      tags: [],
      owner: "553dbfc08d22d5cb1a7024f2",
      components: [
        {
          label: "First Name",
          placeholder: "Enter First Name",
          key: "firstName",
          type: "textfield",
          input: true
        },
        {
          label: "Password",
          placeholder: "Enter password",
          tableView: false,
          key: "password",
          type: "password",
          input: true,
          protected: true
        },
        {
          type: "button",
          label: "Submit",
          key: "submit",
          disableOnInvalid: true,
          input: true
        }
      ]
    }}
    onSubmit={i => {
      console.log(i);
    }}
  />,

  // <Form src="https://peb3z.sse.codesandbox.io/abc" onSubmit={(i)=>{console.log(i)}} />,
  rootElement
);

アップデートを見る ここに画像の説明を入力

4

1 に答える 1