https://github.com/chenxsan/formay

A dead simple form library for Preact.
https://github.com/chenxsan/formay

form preact

Last synced: 27 days ago
JSON representation

A dead simple form library for Preact.

• Host: GitHub
• URL: https://github.com/chenxsan/formay
• Owner: chenxsan
• License: mit
• Created: 2018-12-19T00:32:37.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2018-12-19T13:46:50.000Z (about 6 years ago)
• Last Synced: 2024-11-30T13:54:20.895Z (28 days ago)
• Topics: form, preact
• Language: JavaScript
• Homepage:
• Size: 43 KB
• Stars: 1
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: readme.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Formay

A dead simple form library for Preact with only 1.4kB (gzipped).

## Installation

```sh

npm install formay

```

## Example

[Example on codesandbox](https://codesandbox.io/s/q3xl2l1r09).

```js

/** @jsx h */

import { h, Component } from "preact";

import Formay from "formay";

export default class SignUpForm extends Component {

  render() {

    return (

       {

          let errors = {};

          const { nickname, email } = state;

          if (nickname.trim() === "") {

            errors["nickname"] = "can't be blank";

          }

          if (email.trim() === "") {

            errors["email"] = "can't be blank";

          }

          return errors;

        }}

        onSubmit={(values, setState) => {

          window.alert(JSON.stringify(values));

          // we can call setState from form here.

        }}

        render={({ state, errors, updateValue, onSubmit }) => (

          

            

            {errors["nickname"] ? {errors["nickname"]} : undefined}

            

            {errors["email"] ? {errors["email"]} : undefined}

            

          

        )}

      />

    );

  }

}

```

## TODO

1. [ ] Add test