React Native bir elemanın textContent ini ya da value sini çekmek

Merhaba React Native de daha çok yeniyim ve basit bir şeyler yapmaya çalışıyorum. Bir input ve bir buton var ve butona basıldığında text input un value sini çekip alert olarak ekrana göndermek istiyorum. Ancak gördüm ki Native de javascript de yapıldığı gibi yapılmıyor bu olaylar ve karmaşık geldi. Yardım edebilir misiniz? Kodum da burada eğer yardımı olacaksa:

import type {Node} from 'react';
import {
  SafeAreaView,
  StatusBar,
  StyleSheet,
  Text,
  TextInput,
  TouchableOpacity,
  useColorScheme,
  View,
  _Text,
} from 'react-native';

import {
  Colors,
} from 'react-native/Libraries/NewAppScreen';

const App: () => Node = () => {
  const isDarkMode = useColorScheme() === 'dark';

  const backgroundStyle = {
    backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
  };

  return (
    <SafeAreaView style={{backgroundStyle, display: 'flex', alignItems: 'center', flex:1}}>
      <StatusBar
        barStyle={isDarkMode ? 'light-content' : 'dark-content'}
        backgroundColor={backgroundStyle.backgroundColor}
      />
      <View style={{width: 100+'%',height: 80,padding: 10,flexDirection:'row'}}>
        <TextInput
          style={styles.input}
          placeholder= "Enter a keyword"
        />
        <TouchableOpacity onPress={()=>alert("input un text i burada gösterilmeli")} style={{ height:80,backgroundColor:"gray",flex:3,display:"flex",alignItems:'center',justifyContent:'center'}}><Text>Submit</Text></TouchableOpacity>
      </View>
    </SafeAreaView>
  );
};

const styles = StyleSheet.create({
  input: {
    flex: 7,
    height: 80,
    backgroundColor: "black",
    textAlign: 'center',
  },
});

export default App;