JSPM

  • Created
  • Published
  • Downloads 465
  • Score
    100M100P100Q85276F
  • License MIT

A React Hooks package for input

Package Exports

  • @rooks/use-input

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@rooks/use-input) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@rooks/use-input

Installation

npm install --save @rooks/use-input

Usage

Base

function Demo() {
  const myInput = useInput("hello");
  return (
    <div>
      <input {...myInput} />
      <p>
        Value is <b>{myInput.value}</b>
      </p>
    </div>
  );
}

render(<Demo/>)

With optional validator

function Demo() {
  const myInput = useInput("hello", {
    validate: value => true
  });
  return (
    <div>
      <input {...myInput} />
      <p>
        Value is <b>{myInput.value}</b>
      </p>
    </div>
  );
}

render(<Demo/>)

Arguments

Argument Type Description Default value
initialValue string Initial value of the string ""
opts object Options {syncWithInitialValue: false}

Options

Option key Type Description Default value
syncWithInitialValue boolean Should input update to the initialValue if the initialValue is updated false

Return value

Return value Type Description
{value, onChange} Object Object containing {value : "String", onChange: "function that accepts an event and updates the value of the string"}

Input hook for React