Я хочу сделать условную форму с Formik. Я получаю некоторые поля с ajax, в этом формате, сохраненные в формате json в this.state.specifiche
:
[
{'id':1, 'label': 'Email', 'type': 'TEXT'},
{'id':2, 'label': 'City', 'type': 'SELECT', 'options': {'1': 'AAAA', '2': 'BBBB'}
...}
]
В React Native у меня есть этот код:
...
handleSubmit = (values) => {
console.log(values);
return;
};
render() {
return (
<Formik onSubmit={(values) => this.handleSubmit(values)} >
{({ values, handleChange, handleSubmit }) => (
<Fragment>
<SpecificheList specifiche={this.state.specifiche} navigation={this.props.navigation}/>
<Button onPress={handleSubmit} title="Submit" />
</Fragment>
)}
</Formik>
)
}
...
Компонент SpecificheList:
render() {
return (
<View style={styles.eventsList}>
{this.props.specifiche.map((spec) => {
var returnValue = [];
var field;
returnValue.push(<Text h4>{spec.label}</Text>);
switch(spec.type){
case 'TEXT':
returnValue.push(<TextInput name="email" placeholder={spec.label} />);
break;
case 'BOOL':
...
break;
case 'DATE':
returnValue.push(<Input style={{ height: 40, borderColor: 'gray', borderWidth: 1 }} />);
break;
case 'NUMBER':
returnValue.push(<Input style={{ height: 40, borderColor: 'gray', borderWidth: 1 }} />);
break;
case 'SELECT':
var items = [];
Object.keys(spec.opzioni).map((key) => {
items.push(<Picker.Item label={spec.opzioni[key]} value={key} />);
});
returnValue.push(<Picker>{items}</Picker>);
break;
}
// returnValue.push(</View>);
return returnValue
})}
</View>
);
}
Форма отображается правильно, но когда я нажимаю кнопку Отправить, у меня появляется эта ошибка, ссылающаяся на строку <Formik ...>
:
TypeError : undefined не является объектом
Цель состоит в том, чтобы напечатать все имена полей и значения.