Support for next input focusing functionality
npm install @alcs/react-native-input-autofocus|
iOS |
Android |
|---|---|
|
!Example |
!Example |
npm i @alcs/react-native-input-autofocus
`
- Using yarn
`
yarn add @alcs/react-native-input-autofocus
`
- Using pnpm
`
pnpm add @alcs/react-native-input-autofocus
`
Usage
- Create or add to your component.
`tsx
import React, { useState } from 'react';
import { StyleSheet, TextInput, TextInputProps } from 'react-native';
import { useInputFocusController } from '@alcs/react-native-input-autofocus';
export const Input = (props: TextInputProps) => {
const focusController = useInputFocusController();
const [typedValue, setTypedValue] = useState('');
return (
onChangeText={setTypedValue}
value={typedValue}
{...focusController}
{...props}
/>
);
};
`
- Wrap component where you want to add auto focus.
`tsx
import React from 'react';
import { Input } from './Input';
import { View } from 'react-native';
import { InputFocusController } from '@alcs/react-native-input-autofocus';
export const YourPage = () => {
return (
);
};
``