我正在创建一个Formik表单,将一些输入上传到Firebase
提交表单时,formik值对象中有一个未知的对象Object变量,当我尝试将新数据添加到Firestore中时会导致错误(对象Object:未定义)
任何人以前都遇到过此问题吗?您如何解决?
下面是我的表单代码
谢谢
import React, { Component } from "react";
import { View, Text, StyleSheet } from "react-native";
import { connect } from "react-redux";
import { Formik } from "formik";
// import * as Yup from "yup";
import DatePicker from "react-native-datepicker";
import { Button } from "react-native-elements";
import Input from "../../components/Input";
import { addVoucher } from "../../redux/actions";
class VoucherCreate extends Component {
_handleSubmit = values => {
console.log(values);
// this.props.addVoucher(values);
};
render() {
const { container, buttonStyle } = styles;
return (
<View style={container}>
<Formik
initialValues={{
title: "",
redeemAmount: "",
description: "",
validUntil: "2020-08-08"
}}
onSubmit={this._handleSubmit}
// validationSchema={Yup.object().shape({
// redeemAmount: Yup.number("Amount must be a number").required(
// "Amount is required"
// )
// })}
render={({
values,
handleSubmit,
errors,
touched,
setFieldValue,
setFieldTouched,
isValid,
isSubmitting
}) => (
<React.Fragment>
<Input
label="Title"
value={values.title}
name="title"
onChange={setFieldValue}
onTouch={setFieldTouched}
/>
<Input
label="Redemption Amount"
name="redeemAmount"
autoComplete="none"
keyboardType={"numeric"}
value={values.redeemAmount}
onChange={setFieldValue}
onTouch={setFieldTouched}
error={touched.redeemAmount && errors.redeemAmount}
/>
<Input
label="Description"
name="description"
value={values.description}
onChange={setFieldValue}
onTouch={setFieldTouched}
/>
<View style={{ flexDirection: "row" }}>
<View
style={{
paddingLeft: 5,
justifyContent: "center",
paddingRight: 20
}}
>
<Text style={{ color: "grey" }}>Valid Until</Text>
</View>
<DatePicker
style={{ width: 180 }}
date={values.validUntil}
mode="date"
format="YYYY-MM-DD"
minDate={Date.now.toString()}
maxDate="2050-06-01"
confirmBtnText="Confirm"
cancelBtnText="Cancel"
showIcon={false}
customStyles={{
dateInput: {
marginLeft: 0,
borderColor: "#fff"
}
}}
onDateChange={date => setFieldValue("validUntil", date)}
onTouch={setFieldTouched}
/>
</View>
/>
<Button
backgroundColor="purple"
buttonStyle={buttonStyle}
title="Submit"
onPress={handleSubmit}
disabled={!isValid || isSubmitting}
loading={isSubmitting}
/>
</React.Fragment>
)}
/>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center"
// justifyContent: "center"
},
buttonStyle: {
marginTop: 20,
width: "100%"
}
});
export default connect(
null,
{ addVoucher }
)(VoucherCreate);