Here is my code. 
     
const [skill,  setSkill]  = useState({
      name:"",
      exp:""
     })
        <TextInput
             placeholder={"Enter skill"}
             placeholderTextColor={colors.divide_color}
             value={skill.name}
             editable={editable}
             onChangeText={(text) => setSkill({name:text})}
             style={styles.textInput}
      />
       <TextInput
            placeholder={"Enter experience"}
            placeholderTextColor={colors.divide_color}
            value={skill.exp}
            editable={editable}
            onChangeText={(text) => setSkill({exp:text})}
            style={styles.textInput}
         />
                     
        <TouchableOpacity 
           onPress={() => {
            console.log(skill, "Skills");
              if(skill.name.trim().length != 0 && skill.exp.trim().length != 0){
                    onAdd(skill)
                    setSkill({
                         name:"",
                         exp:""  
                    })
              }                    
        }}
        style={styles.AddButton} >
          <AntDesign 
              name={"pluscircle"} 
              size={wp(10)} 
              color={colors.dark_primary_color}  
          />
      </TouchableOpacity>

CodePudding user response：

The problem is with your state saving. When saving, you are ignoring the other property. Use the following:

onChangeText={(text) => setSkill(prev => ({...prev, exp:text}))}

Do the same for the name as well. This preserves previous values and changes only necessary field.