ProdutorAgro / react-native-masked-input-text

A typescript masked input component for react-native
14 stars 13 forks source link

input .focus() is not working #4

Open mufaddalhamidofficial opened 4 years ago

mufaddalhamidofficial commented 4 years ago

Screenshot_1573665508

<TextInputMask
    {...props}
    ref={input => { this.numInput = input; }}
    type={'cel-phone'}
    options={{
        maskType: 'Custom',
        withDDD: true,
    }}
    mask='+91 0000 000 000'
/>
_this2.numInput.focus is not a function
onSubmitEditing
    E:\React Native\collections\screens\Auth\SignUp.js:96:75
invokeGuardedCallbackImpl
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:93:9
invokeGuardedCallback
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:318:30
invokeGuardedCallbackAndCatchFirstError
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:342:24
executeDispatch
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:715:2
executeDispatchesInOrder
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:737:4
executeDispatchesAndRelease
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:894:4
executeDispatchesAndReleaseTopLevel
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:902:9
forEachAccumulated
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:876:7
runEventsInBatch
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:1050:2
runExtractedEventsInBatch
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:1072:2
_receiveRootNodeIDEvent/<
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:2707:4
batchedUpdates$1
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:18527:11
batchedUpdates
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:2611:11
_receiveRootNodeIDEvent
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:2706:2
receiveEvent
    E:\React Native\collections\node_modules\react-native\Libraries\Renderer\oss\ReactNativeRenderer-dev.js:2726:2
__callFunction
    E:\React Native\collections\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:366:41
callFunctionReturnFlushedQueue/<
    E:\React Native\collections\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:106:11
__guard
    E:\React Native\collections\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:314:8
callFunctionReturnFlushedQueue
    E:\React Native\collections\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:105:9
onmessage</<
    debuggerWorker.js:80:58
mathnogueira commented 4 years ago

Sorry, for the delay. I will take a look today when I arrive home and will deploy a new version containing the solution.

mufaddalhamidofficial commented 4 years ago

any progress

mufaddalhamidofficial commented 4 years ago

What happened... any progress

sallar commented 4 years ago

I will send a PR soon for this. @mufaddalhamidofficial @mathnogueira

sallar commented 4 years ago

After my PR goes through, you can set the innerRef like this:

        <MaskedInput
          placeholder="Phone Number"
          style={styles.input}
          mask="(000) 000-0000"
          keyboardType="phone-pad"
          value={phoneNumber}
          onChangeText={setPhoneNumber}
          innerRef={(ref) => (phoneNumberRef.current = ref)}
        />