Текущий текстовый ввод React Native

Во-первых, аргументом обработчика события onChange является не новое значение ввода, а объект события. Вы можете получить доступ к значению, выполнив что-то вроде этого:

onChange(event) {
    let text = event.target.value;
    ...

я пытаюсь сделать так, но

export default function AppTextInput({icon, placeholder,onChangeText, ...otherProps}) {

  const  onChanged =(text) =>{
      let newText = '';
      let numbers = '0123456789';
      for (var i=0; i < text.length; i++) {

              if (numbers.indexOf(text[i]) > -1) {
                  newText = newText + text[i];
              } else {
                  alert("please enter integer numbers only");

              }
      }

    }

    return (

        <View style = {styles.container}>
            {icon &&
                <MaterialCommunityIcons style = {{marginRight: 10}} name = {icon} color = {colors.grayMedium} size = {20}/>}
            <TextInput style = {defaultStyles.text} placeholder = {placeholder}
                       onChangeText = {(text)=> onChanged(text)}  maxLength = {3} {...otherProps}
            ></TextInput>
        </View>
    )
}

когда я ввожу оповещение, работает, но onChangeText = {(text) => setNumRounds(text)} и другие не видят мой ввод, почему?

  <View style = {{top: -80}}>
                    <AppTextInput icon = "timer-sand"  placeholder = {"Prep Time"} keyboardType='numeric' onChangeText = {(text) => setPrepTime(text)}/>
                    <AppTextInput icon = "timer" placeholder = {"Round Duration"} keyboardType='number-pad' onChangeText = {(text) => setRoundDuration(text)}/>
                    <AppTextInput icon = "timer" placeholder = {"Break Duration"} keyboardType='number-pad' onChangeText = {(text) => setBreakDuration(text)}/>
                    <AppTextInput icon = "repeat" placeholder = {"Number of Rounds"} keyboardType='number-pad'  onChangeText = {(text) => setNumRounds(text)}/>
                    <AppTextInput icon = "format-list-numbered" placeholder = {"Number of Sets"} keyboardType='number-pad' onChangeText = {(text) => setNumSets(text)}/>
                    {exerciseInputEles}
                </View>

Вот код, который вы можете использовать:

1. Я перемещаю имеющуюся у вас функцию onChanged в другой файл и использую Regex для замены нецифрового символа пустой строкой.

Кроме того, я изменил входное значение вашего onChangeText с (text)=> onChanged(text) на onChangeText (это реквизит), потому что onChanged больше нет.

export default function AppTextInput({
  icon,
  placeholder,
  onChangeText,
  ...otherProps
}) {
  return (
    <View style = {styles.container}>
      {icon && (
        <MaterialCommunityIcons
          style = {{ marginRight: 10 }}
          name = {icon}
          color = {colors.grayMedium}
          size = {20}
        />
      )}
      <TextInput
        style = {defaultStyles.text}
        placeholder = {placeholder}
        onChangeText = {onChangeText}
        maxLength = {3}
        {...otherProps}
      ></TextInput>
    </View>
  );
}

2. Здесь я добавил функцию под названием replaceNonNumeric, функция используется для замены любой нечисловой цифры на пустую строку, поэтому в ней будет только цифра.

3. Я вызвал replaceNonNumeric прямо перед изменением состояния и передал новое значение в setState.

...
 const replaceNonNumeric = (text) => {
    return text.replace(/[^0-9]/g, '');
  };

  return (
    <View style = {{ top: -80 }}>
      <AppTextInput
        icon = "timer-sand"
        placeholder = {'Prep Time'}
        keyboardType = "numeric"
        onChangeText = {(text) => {
          const newText = replaceNonNumeric(text);
          setPrepTime(newText);
        }}
      />
      <AppTextInput
        icon = "timer"
        placeholder = {'Round Duration'}
        keyboardType = "number-pad"
        onChangeText = {(text) => {
          const newText = replaceNonNumeric(text);
          setRoundDuration(newText);
        }}
      />
      <AppTextInput
        icon = "timer"
        placeholder = {'Break Duration'}
        keyboardType = "number-pad"
        onChangeText = {(text) => {
          const newText = replaceNonNumeric(text);
          setBreakDuration(newText);
        }}
      />
      <AppTextInput
        icon = "repeat"
        placeholder = {'Number of Rounds'}
        keyboardType = "number-pad"
        onChangeText = {(text) => {
          const newText = replaceNonNumeric(text);
          setNumRounds(newText);
        }}
      />
      <AppTextInput
        icon = "format-list-numbered"
        placeholder = {'Number of Sets'}
        keyboardType = "number-pad"
        onChangeText = {(text) => {
          const newText = replaceNonNumeric(text);
          setNumSets(text);
        }}
      />
      {exerciseInputEles}
    </View>
...