TextInput won't let me type text inside, only for this particular Text Input-CodePudding

So there are many TextInputs on this app so far, but this has been the only one out of them all that will not allow any text, it just flashes the letters or numbers typed, and immediately deletes. Any idea what could be wrong here?

MyProfile.js

import { View, Text, StyleSheet, ScrollView, Pressable, TextInput} 
from 'react-native'
import React, { useState } from 'react'
import { useNavigation } from '@react-navigation/native'
const MyProfile = () => {

const [phoneNumber, setPhoneNumber] = useState('');

        <View style={styles.inputContainer}>
            <View>
                <Text style={styles.inputText}>Country</Text>
                <TextInput 
                    placeholder='#'
                    style={styles.countryCode}
                />
            </View>
            <View>
                <Text style={styles.inputText}>Phone Number</Text>
                <TextInput 
                    placeholder='###-###-####'
                    value={phoneNumber}
                    setValue={setPhoneNumber}
                    style={styles.phoneNumber}
                />
            </View>
        </View>

const styles = StyleSheet.create({
inputContainer: {
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-between',
    marginBottom: 30,
},
inputText: {
    fontWeight: 'bold',
    marginBottom: 10
},
countryCode: {
    width: 60,
    height: 40,
    padding: 10,
    backgroundColor: 'white',
    borderRadius: 10
},
phoneNumber: {
    width: 300,
    height: 40,
    padding: 10,
    backgroundColor: 'white',
    borderRadius: 10
},

I can post more information if more is needed. but this should be everything associated with that particular input/screen. Thank you

CodePudding user response：

This happens, because in your TextInput component you have the "setValue" property, and it doesn't exist, you have to do something like this:

<TextInput 
  placeholder='###-###-####'
  value={phoneNumber}
  onChangeText={(value) => setPhoneNumber(value)}
  style={styles.phoneNumber}
/>

If this solves your problem, I would appreciate an upvote.