How to get values from TextInput - react-native

Question

I'm stuck in a apparently simple function.
How can I get a value (string) from a TextInput?
Here an extract of the code:
const Insert = props => {
const [enteredName, setEnteredName] = useState();
const sendValues = (enteredName) => {
console.log(enteredName);
};
<TextInput
placeholder="Your Name"
blurOnSubmit
autoCorrect={false}
maxLength={30}
autoCapitalized="words"
placeholderTextColor="#777"
value={enteredName}
onChangeText={text => setEnteredSurname(text)}
/>
<View>
<Button title="Submit" onPress={sendValues(enteredName)} />
I get the typing when I type but it doesn't submit anything.
Any idea about it??
Thanks in advance!

Answer 1

You should transform your onPress from an expression to a function and init your state
const Insert = props => {
const [enteredName, setEnteredName] = useState(''); //INIT TO EMPTY
function sendValues(enteredName) {
console.log(enteredName);
};
<TextInput
placeholder="Your Name"
blurOnSubmit
autoCorrect={false}
maxLength={30}
autoCapitalized="words"
placeholderTextColor="#777"
value={enteredName}
onChangeText={text => setEnteredSurname(text)} />
<View>
<Button title="Submit" onPress={() => sendValues(enteredName)} /> //Function not expression
</View>

Answer 2

class AwesomeProject extends Component {
constructor(props){
super(props)
this.state = {
username: '',
password: '',
}
}
_handlePress() {
console.log(this.state.username);
console.log(this.state.password);
}
render() {
return (
<ScrollView style={styles.content}>
<View style={styles.content}>
<Text style={styles.welcome}>
Create Account
</Text>
<Text style={styles.textStyle}>
Name
</Text>
<TextInput
style={styles.textInputStyle}
placeholder="Enter Name"
returnKeyLabel = {"next"}
onChangeText={(text) => this.setState({username:text})}
/>
<Text style={styles.textStyle}>
Name
</Text>
<TextInput
style={styles.textInputStyle}
placeholder="Enter Name"
returnKeyLabel = {"next"}
onChangeText={(text) => this.setState({password:text})}
/>
<Button
onPress={() => this._handlePress()}
style={styles.buttonStyle}>
Submit
</Button>
</View>
</ScrollView>
);
}
}

Answer 3

Try this, you have to use it like this :
import React, { useState } from 'react';
import {Text, View,TextInput,Button} from 'react-native';
export default Example = () => {
const [enteredName, setEnteredName] = useState('');
sendValues = (enteredName) =>{
console.log(enteredName);
};
return (
<View>
<Text>Hey</Text>
<TextInput
placeholder="Your Name"
blurOnSubmit
autoCorrect={false}
maxLength={30}
autoCapitalized="words"
placeholderTextColor="#777"
value={enteredName}
onChangeText={text => setEnteredSurname(text)} />
<View>
<Button title="Submit" onPress={() => sendValues(enteredName)} />
</View>
</View>
);
}