Skip to content

Instantly share code, notes, and snippets.

@yuritoledo

yuritoledo/formik_hook2.js

Last active November 27, 2019 13:57
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save yuritoledo/fcca512185861d445f8e6e277bc39040 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save yuritoledo/fcca512185861d445f8e6e277bc39040 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. yuritoledo revised this gist Nov 26, 2019. 1 changed file with 2 additions and 27 deletions.
    29 changes: 2 additions & 27 deletions formik_hook2.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,26 +1,4 @@
    import React from "react";
    import { useFormik } from "formik";

    const initialValues = {
    name: "",
    email: "",
    address: {
    street: "",
    city: ""
    },
    password: "",
    confirmPassword: ""
    };

    const MyForm = () => {
    const onSubmit = values => {};

    const formik = useFormik({
    initialValues,
    onSubmit
    });

    return (
    // {...}
    <div>
    <form>
    <input placeholder="Name" {...formik.getFieldProps("name")} />
    @@ -45,7 +23,4 @@ const MyForm = () => {
    <pre>{JSON.stringify(formik.values, null, 2)}</pre>
    </div>
    </div>
    );
    };

    export default MyForm;
    // {...}
  2. yuritoledo created this gist Nov 26, 2019.
    51 changes: 51 additions & 0 deletions formik_hook2.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,51 @@
    import React from "react";
    import { useFormik } from "formik";

    const initialValues = {
    name: "",
    email: "",
    address: {
    street: "",
    city: ""
    },
    password: "",
    confirmPassword: ""
    };

    const MyForm = () => {
    const onSubmit = values => {};

    const formik = useFormik({
    initialValues,
    onSubmit
    });

    return (
    <div>
    <form>
    <input placeholder="Name" {...formik.getFieldProps("name")} />
    <br />
    <input placeholder="Email" {...formik.getFieldProps("email")} />
    <br />
    <input placeholder="Password" {...formik.getFieldProps("password")} />
    <br />
    <input
    placeholder="confirm password"
    {...formik.getFieldProps("confirmPassword")}
    />
    <br />
    <input
    placeholder="Address"
    {...formik.getFieldProps("address.street")}
    />
    <br />
    <input placeholder="City" {...formik.getFieldProps("address.city")} />
    </form>
    <div style={{ textAlign: "left" }}>
    <pre>{JSON.stringify(formik.values, null, 2)}</pre>
    </div>
    </div>
    );
    };

    export default MyForm;