React Native TextInput – can’t get/entry worth in onSubmitEditing handler (particularly iOS)

0
104


OK, after heaps and plenty of googling…

I discovered that the right variable that’s handed from the onSubmittedEditing occasion is not an occasion object and not even a easy textual content string as within the case of the onChangeText occasion. However fairly it is a worth object with a nativeEvent property. This object of sort nativeEvent in flip incorporates a textual content property/variable which incorporates the precise textual content/worth from the TextInput area/management.

Now if you happen to’re growing for the net, you may see that this nativeEvent has a complete bunch of properties together with the acquainted internet/HTML goal property, which then incorporates a worth property ==> BUT, THIS MIGHT CONFUSE YOU AS IT DID ME ==> as a result of on different platforms (I can solely converse definitively proper now about ios) the worth object has solely 3 properties and corresponding values (the beneath is an instance if you happen to/the consumer entered “3” as the worth within the textInput management:

worth: {
"eventCount": 1, 
"goal": 1855, 
"textual content": "3"
}

in order that makes the next the right syntax on your react-native code:

import React, {useState} from 'react';

const App = (props) =>{

    const [input, setInput] = useState('');

    const onChangeText (textual content) => {
      setInput(textual content)
    }  
    const onSubmitted (worth) => {
        console.log(worth.nativeEvent.textual content)   // <== this doesn't work (is undefined)
    } 
    ...
    //extra code right here
    ... 
    return (
      <TextInput
        fashion={kinds.enter}
        onChangeText={onChangeText}
        onSubmitEditing={onSubmitted}
        worth={enter}   
      />
    );
};
export default App;