bulma-react-form
TypeScript icon, indicating that this package has built-in type declarations

0.0.2 • Public • Published

bulma-react-form

simple form validate 、auto inject and show error when need , display UI with framework bulma .

NPM JavaScript Style Guide

bulma-react-form-screenshot

Install

npm install --save bulma-react-form

Usage

import React, {Component} from 'react'
 
import {formWrapper, FormItem, Input} from 'bulma-react-form'
 
class App extends Component {
  render() {
    const {form} = this.props;
    return (
      <div className='container'>
        <FormItem label='input required' field={'test'}>
          {form.getFieldDecorator('test', {
            rules: [{
              required: true,
              message: 'This component is required , you can define anything here'
            }]
          })(
            <Input placeholder={'asdfsdf'}/>
          )}
        </FormItem>
        <FormItem label='input not required' field={'test2'}>
          {form.getFieldDecorator('test2')(
            <Input placeholder={'asdfsdf'}/>
          )}
        </FormItem>
        <div className="field is-grouped">
          <div className="control">
            <button className="button is-link" onClick={() => form.validateFields()}>提交</button>
          </div>
          <div className="control">
            <button className="button is-link is-light">Cancel</button>
          </div>
        </div>
      </div>
    )
  }
}
 
export default formWrapper(App);
 

License

MIT © eaTong

Versions

Current Tags

VersionDownloads (Last 7 Days)Tag
0.0.20latest

Version History

VersionDownloads (Last 7 Days)Published
0.0.20
0.0.10

Package Sidebar

Install

npm i bulma-react-form

Weekly Downloads

0

Version

0.0.2

License

MIT

Unpacked Size

45.3 kB

Total Files

8

Last publish

Collaborators

  • eatong