react-native-otp-column

react-native-otp-column

Sample Screenshot

Guide :

Install package using

npm i react-native-otp-column

Use as given in below example

Example :

import React, { useState} from 'react';
import {View} from 'react-native';
import OtpColumn from 'react-native-otp-column';

const OtpComponent = props => {
  const [otp, setOpt] = useState('');

  return (
    <View style={{flex: 1}}>
      <OtpColumn 
          numberOfCell={6} 
          value={otp} 
          setOtpValue={setOpt} 
          //editable={false}
          style={{borderColor: 'black', borderWidth: 4, borderRadius: 20}}
      />
    </View>
  );
};

export default OtpComponent;

Props:

Props	type	Default
numberOfCell	Number	required as props
value	Number	required state value
setOtpValue	function	required state setter function
style	style Object	Object
editable	Boolean	true