以下のパッケージを使用してフォームを動的に生成しています。
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
);