github地址

https://github.com/daixianceng/formik-material-fields

 

formik-material-fields

A set of material style fields for formik

formik-material-fields = formik + material-ui

This library provides the following components:

  • FormikTextField
  • FormikSelectField
  • FormikRadioGroupField
  • FormikCheckboxGroupField

Documentation

Installation

Using npm:

$ npm install --save formik-material-fields

Using yarn:

$ yarn add formik-material-fields

Usage

import React, { Component } from 'react';
import { Formik, Form } from 'formik';
import * as Yup from 'yup';
import { FormikTextField } from 'formik-material-fields';

const validationSchema = Yup.object().shape({
  username: Yup.string().required(),
});

const initialValues = {
  username: '',
};

class MyForm extends Component {
  render() {
    return (
      <Formik
        initialValues={initialValues}
        validationSchema={validationSchema}
        onSubmit={this.props.onSubmit}
      >
        {({ isValid }) => (
          <Form autoComplete="off">
            <FormikTextField
              name="username"
              label="Username"
              margin="normal"
              fullWidth
            />
          </Form>
        )}
      </Formik>
    );
  }
}

License

formik-material-fields is released under the FSB License. See the bundled LICENSE for details.

Logo

开放原子开发者工作坊旨在鼓励更多人参与开源活动,与志同道合的开发者们相互交流开发经验、分享开发心得、获取前沿技术趋势。工作坊有多种形式的开发者活动,如meetup、训练营等,主打技术交流,干货满满,真诚地邀请各位开发者共同参与!

更多推荐