How to persist Redux Form Values? - react-native

Question

I am using accordion-collapse-react-native to manage Sections. When i collapse that section and opens it again the redux form values disappear. How can i manage to maintain the state of the Redux Form Field Values. Thanks in advance.
Here is my code :
<Collapse style={styles.item} isCollapsed={this.state.isCollapsed_First}
onToggle={isCollapsed => this.setState({ isCollapsed_First: isCollapsed })}
>
<CollapseHeader style={styles.header}>
<View style={styles.headerContent}>
<Text style={styles.headerText} >Personal Information</Text>
<Icon name={this.state.isCollapsed_First ? "arrow-up" : "arrow-down"} size={18} color='#fff' />
</View>
</CollapseHeader>
<CollapseBody>
<View style={{flexDirection:'row',marginTop:7}}>
<View style={{width:'48%',marginRight:'4%'}}>
<Field name="first_name"
placeholder="First Name"
inputViewStyle={styles.inputView}
inputTextStyle={styles.inputText}
component={this.renderTextInput}
/>
</View>
<View style={{width:'48%'}}>
<Field name="last_name"
placeholder="Last Name"
inputViewStyle={styles.inputView}
inputTextStyle={styles.inputText}
component={this.renderTextInput}
/>
</View>
</View>
<View style={{flexDirection:'row',marginTop:-7}}>
<View style={{width:'100%'}}>
<Field name="dd_country"
placeholder="Country"
data = {this.state.countriesList}
onItemSelect={item => this.props.change('dd_country', item.id)}
textInputStyle={styles.inputView}
component={this.renderDropdownInput}
/>
</View>
</View>
<View style={{flexDirection:'row',marginTop:-7}}>
<View style={{width:'100%'}}>
<Field name="dd_ben_type"
placeholder="Beneficiary Type"
data = {this.state.custTypesList}
onItemSelect={item => this.props.change('dd_ben_type', item.id)}
textInputStyle={styles.inputView}
component={this.renderDropdownInput}
/>
</View>
</View>
</CollapseBody>
</Collapse>

Answer 1

You have to maintain it's state yourself.
Try maintaining the state in the component, something like this:
export function Form() {
const [name, setName] = useState('');
const [country, setCountry] = useState('');
return(
<View>
<Input
onChangeText={setName}
value={name}
placeholder='Name'
/>
<Input
onChangeText={setCountry}
value={country}
placeholder='Country'
/>
</View>
)
}