web-dev-qa-db-ja.com

サーバーにnull値を送信するReactJSFormik隠しフィールド

React私はFormIKを使用していますが、非表示のフィールドを追加しない限り、フォームデータを正常に投稿しています。

<Field type="hidden" className="form-control" name="hiddenField" /> 

フォームを投稿すると、非表示フィールドのNull値が送信されます。また、Formikに初期値を提供しました。

<Formik initialValues={{
first_name:'',last_name:'',username:'',email:'',password:'',
password_confirmation:'',distributor:'',phone_number:'',address:'',country:'',
state:'',city:'',Zip_code:'',hiddenField:''
}} >

足りないものはありますか?

4
Abdul Qadir

これが私がFormikで隠しフィールド値を管理した方法です

Tageの前に引数としてsetFieldValueを渡しました

{({ values, errors, touched, handleSubmit, setFieldValue , isSubmitting }) => (
<Form>
<div className="form-group has-feedback">
<input type="hidden" value="testing" name="testingField" />

それから私はそれをonClickメソッドに変更することができました(必要に応じて使用できます)

<button type="submit" className="btn btn-primary btn-block btn-flat" 
onClick={() => {setFieldValue("hiddenField", "yourValueHere OR dynamicVariable"); }} 
disabled={isSubmitting}>Register</button>
0
Abdul Qadir

私はちょうどこの問題にも遭遇しました。私の回避策は、初期値を追加するだけで、非表示のフィールドを使用しないことでした。その結果、onSubmit()で、valuesオブジェクトにinitialValues値を持つ隠しフィールドキーが含まれていました。

誰かがこれについて行く正しい方法を知っているかどうか知りたいですか?私のやり方は少しハッキーなようですか?

0
Greg McKelvey