search

ttdung11t2 / react-native-confirmation-code-input

A react-native component to input confirmation code for both Android and IOS
MIT License
411 stars 346 forks source link

how to make a confirmation code input active(focus on a confirmation code input)? #57

Open LordAltair74 opened 4 years ago

LordAltair74 commented 4 years ago

Hi I recently used this package for my project and now I have 2 confirmation code input field and the second one is active. I want to activate the first one when I start the program and then when I filled the first one I want to jump to second one.

this is a part of my code:

` <CodeInput ref="codeInputRef1" className={'border-b'} codeLength={2} space={10} size={13} inputPosition='center' activeColor='#BFBFBF' inactiveColor='#BFBFBF' codeInputStyle={{ color: '#000000', fontFamily: "IRANSans(FaNum)", fontSize: 28, height: responsiveHeight(5.85), bottom: responsiveHeight(1.14), right: 8 }} onFulfill={(code) => this._onFulfillFirst(code)} />

this._onFulfillSecond(code)} />` i want to go from first input to second input. thanks for your help.
iomier commented 4 years ago

hi, You can use code input refs array to focus your conformation code. for example on calling this._onFulfillFirst you can add this snippet to focus on next code input: this.codeInputRef2.current.codeInputRefs[0].focus();