Recompose: Provide standard handler for input onChange event

Created on 8 Jan 2018  路  2Comments  路  Source: acdlite/recompose

Form inputs (including <input> of many types, <textarea>, <select>), when firing an onChange event, provide both the name and value in the event.target. This makes it possible to provide a common handler for all these:

export default withStateHandlers(
  { username: '', password: '' },
  { onChange: () => ({ target: { name, value } }) => ({ [name]: value }) }
)(({ username, password }) => (
  <form>
    <div className="field">
      <label htmlFor="username">User name</label>
      <input type="text" name="username" id="username" value={username} />
    </div>
    <div className="field">
      <label htmlFor="password">Password</label>
      <input type="password" name="password" id="password" value={password} />
    </div>
    <div className="actions">
      <button type="submit">Sign in</button>
    </div>
  </form>
));

Since each input field provides its own name, this works. This pattern is very common to most form state management.

My question is, if it'd make sense to provide this common handler out-of-the-box by this library:

import { withStateHandlers, inputChangeHandler } from 'recompose';

export default withStateHandlers(
  { username: '', password: '' },
  { onChange: inputChangeHandler }
)(LoginForm);

I'd understand if it may be considered too much, but in case this is accepted, I can work on the PR myself.

(PS: great library BTW!!)

Most helpful comment

Hi, we are trying to not extend api with so specific use cases, as its very easy to create such hoc wrapping an existing hocs. Think of recompose as like as simple building blocks for your own enhancers too.
There are enormous amount of different repeated use cases we have as a developers everyday, if we will add them all it will be hard to support this library, as even in current simple implementation people found bugs etc ;-)

All 2 comments

Hi, we are trying to not extend api with so specific use cases, as its very easy to create such hoc wrapping an existing hocs. Think of recompose as like as simple building blocks for your own enhancers too.
There are enormous amount of different repeated use cases we have as a developers everyday, if we will add them all it will be hard to support this library, as even in current simple implementation people found bugs etc ;-)

Yup, I totally get it. Makes sense. Thanks!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jethrolarson picture jethrolarson  路  4Comments

franklinkim picture franklinkim  路  3Comments

SeanGroff picture SeanGroff  路  4Comments

xialvjun picture xialvjun  路  4Comments

uriklar picture uriklar  路  4Comments