Guest User

Untitled

a guest
Sep 15th, 2018
102
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.79 KB | None | 0 0
  1. import React from "react";
  2. import { Col } from "react-bootstrap";
  3.  
  4. import { withFormik, Form, Field } from "formik";
  5.  
  6. const Login = ({ errors, touched }) => (
  7. <Form className="form-horizontal">
  8. <fieldset>
  9. <legend className="text-center">
  10. <h2>Login</h2>
  11. </legend>
  12.  
  13. <div className="form-group">
  14. <label className="col-lg-2 control-label">Username</label>
  15. <div className="col-lg-10">
  16. <Field
  17. type="text"
  18. className="form-control"
  19. placeholder="username"
  20. name="username"
  21. />
  22. {errors.username && touched.username && errors.username}
  23. </div>
  24. </div>
  25.  
  26. <div className="form-group">
  27. <label htmlFor="inputPassword" className="col-lg-2 control-label">
  28. Password
  29. </label>
  30. <div className="col-lg-10">
  31. <Field
  32. type="password"
  33. className="form-control"
  34. placeholder="Password"
  35. name="password"
  36. />
  37. {errors.password && touched.password && errors.password}
  38. </div>
  39. </div>
  40. <div className="form-group">
  41. <Col lg={10} lgOffset={2}>
  42. <button
  43. // disabled={this.props.user.isLogging}
  44. className="btn btn-primary login-button btn-block LoginButton"
  45. // disabled={this.state.isEnabled}
  46. // onClick={this.handlesOnLogin}
  47. >
  48. <span> Login </span>
  49. </button>
  50. </Col>
  51. </div>
  52. </fieldset>
  53. </Form>
  54. );
  55. const formikEnhancer = withFormik({
  56. initialValues: { username: "", password: "" },
  57. handleSubmit: (values, { setSubmitting }) => {
  58. setTimeout(() => {
  59. alert(JSON.stringify(values, null, 2));
  60. setSubmitting(false);
  61. }, 400);
  62. }
  63. });
  64.  
  65. export default formikEnhancer(Login);
Add Comment
Please, Sign In to add comment