https://github.com/dnbard/react-validation-component

Utility component that solves data validation problem with the help of PropTypes
https://github.com/dnbard/react-validation-component

prop-types react reactjs validation

Last synced: over 1 year ago
JSON representation

Utility component that solves data validation problem with the help of PropTypes

• Host: GitHub
• URL: https://github.com/dnbard/react-validation-component
• Owner: dnbard
• Created: 2018-07-19T11:36:01.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2018-08-17T11:37:06.000Z (almost 8 years ago)
• Last Synced: 2025-01-26T05:41:21.115Z (over 1 year ago)
• Topics: prop-types, react, reactjs, validation
• Language: JavaScript
• Homepage:
• Size: 630 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 3
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
![react validation component logo](https://raw.githubusercontent.com/dnbard/react-validation-component/master/public/logo.png)  

[![Build Status](https://travis-ci.org/dnbard/react-validation-component.svg?branch=master)](https://travis-ci.org/dnbard/react-validation-component)

[![codecov](https://codecov.io/gh/dnbard/react-validation-component/branch/master/graph/badge.svg)](https://codecov.io/gh/dnbard/react-validation-component)

**React Validation Component** is an utility component that solves data validation problem with the help of "native" React tool - `prop-types`.

Note: This **library is in development** and `API are going to be changed in the future`!

# Basic Example

Just show me the code!

```js

import React, { Component } from 'react';

import ReactValidation from 'react-validation-component';

import PropTypes from 'prop-types';

class MyComponent extends Component{

  constructor(){

    super();

    this.state = { username: '', age: 0 };

    this.myForm = {

      username: PropTypes.string.isRequired

      age: PropTypes.number.isRequired

    };

  }

  onFormValidation(errors){

    // this method are going to be called on every validation

  }

  render(){

    const { username, age } = this.state;

    return 

      { this.state }

       this.setState({ username: e.target.value }) } />

       this.setState({ age: e.target.value }) } />

    

  }

}

```