Package Exports

rc-input
rc-input/assets/index.css
rc-input/es/hooks/useCount
rc-input/es/hooks/useCount.js
rc-input/es/index.js
rc-input/es/utils/commonUtils
rc-input/es/utils/commonUtils.js
rc-input/lib/hooks/useCount
rc-input/lib/hooks/useCount.js
rc-input/lib/index.js
rc-input/lib/utils/commonUtils
rc-input/lib/utils/commonUtils.js

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 (rc-input) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

rc-input ⌨️

Install

Usage

import Input from 'rc-input';
import { render } from 'react-dom';

render(<Input placeholder="input" allowClear />, mountNode);

API

Property	Type	Default	Description
prefixCls	string	rc-input
className	string	''	additional class name of input
style	React.CSSProperties		style properties of input
affixWrapperClassName	string	-	className with 'rc-input-affix-wrapper'
groupClassName	string	-	className with 'rc-input-group-wrapper'
wrapperClassName	string	-	className with 'rc-input-wrapper'
addonAfter	ReactNode	-	The label text displayed after (on the right side of) the input field
addonBefore	ReactNode	-	The label text displayed before (on the left side of) the input field
allowClear	boolean \| { clearIcon: ReactNode }	false	If allow to remove input content with clear icon
bordered	boolean	true	Whether has border style
defaultValue	string	-	The initial input content
disabled	boolean	false	Whether the input is disabled
id	string	-	The ID for input
maxLength	number	-	The max length
showCount	boolean \| { formatter: ({ value: string, count: number, maxLength?: number }) => ReactNode }	false	Whether show text count
prefix	ReactNode	-	The prefix icon for the Input
suffix	ReactNode	-	The suffix icon for the Input
type	string	`text`	The type of input, see: MDN( use `Input.TextArea` instead of `type="textarea"`)
value	string	-	The input content value
onChange	function(e)	-	Callback when user input
onPressEnter	function(e)	-	The callback function that is triggered when Enter key is pressed

inputRef

const inputRef = useRef(null);

useEffect(() => {
  inputRef.current.focus();// the input will get focus
  inputRef.current.blur();// the input will lose focus
  console.log(inputRef.current.input);// The origin input element
}, []);
// ....
<Input ref={inputRef} />

Property	Type	Description
focus	`(options?: InputFocusOptions) => void`	The input get focus when called
blur	`() => void`	The input loses focus when called
input	`HTMLInputElement \| null`	The origin input element

Development

npm install
npm start

License

rc-input is released under the MIT license.