how to call this add function-CodePudding

I am using andSubject function to set the subject in the parent component but it's not working can someone help me how can I call addSubject when I press the RoundedButton?

...
const [tempItem, setTempItem] = useState(null);
.....
        <View style={styles.inputContainer}>
          <TextInput
            style={styles.textInput}
            onSubmitEditing={({ nativeEvent }) => {
              setTempItem(nativeEvent.text);
              // addSubject(nativeEvent.text);
            }}
          />
          <RoundedButton
            title=" "
            size={50}
            onPress={() => addSubject(tempItem)}
          />
        </View>
...

CodePudding user response：

I guess you are looking for something like this :

const [tempItem, setTempItem] = React.useState("");
const [addSubject , setAddSubject] = React.useState("");
        

...
      return (
        <View style={styles.container}>
          <View style={styles.inputContainer}>
          <Text>this text bellow will show after pressing on the button :</Text>
          <Text>{addSubject}</Text>
              <TextInput
                style={styles.textInput}
                onChangeText={setTempItem}
              />
              <Button
                title=" "
                size={50}
                onPress={() => setAddSubject(tempItem)}
              />
            </View>
        </View>
      );
    }

...

demo

CodePudding user response：

You have to pass the function to children by props.

parent.js

  function setAddSubject(item){
    console.log(item)
}

    <YourForm call={(item)=>setAddSubject(item) }  />

YourForm.js

    export default =(props)=>{
       const [tempItem, setTempItem] = useState(null);
    return (
           <View style={styles.inputContainer}>
          <TextInput
            style={styles.textInput}
            onSubmitEditing={({ nativeEvent }) => {
              setTempItem(nativeEvent.text);
              // addSubject(nativeEvent.text);
            }}
          />
          <RoundedButton
            title=" "
            size={50}
            onPress={() => props.call(tempItem)}
          />
        </View>
          );
     }