handleChange не работает для formik внутри модального - PullRequest
Новая
       27

handleChange не работает для formik внутри модального

0 голосов
/ 14 апреля 2019

Я новичок, чтобы отреагировать, и я пытался сделать визуализацию внутри модала из antd, но мой handeChange не работает. это обычно работает, если я пишу все внутри модального, но я хочу знать, как это можно сделать с помощью другого компонента и с помощью formik 

const InnerForm=({
                     submitted,
                     loading,
                     errors,
                     handleSubmit,
                     handleChange,
                     values,
                     modalCancel
                 })=>
    (
        <Form className="form" onSubmit={handleSubmit}>
            <FormItem>
                <Input prefix={<Icon type="user" style={{ color: 'rgba(0,0,0,.25)' }} />}
                       placeholder="email"
                       onChange={handleChange}
                       name={"email"}
                />
            </FormItem>
            <FormItem>
                <Input prefix={<Icon type="lock" style={{ color: 'rgba(0,0,0,.25)' }} />}
                       type="password"
                       placeholder="Password"
                       onChange={handleChange}
                       name={"password"}
                />
            </FormItem>
            <FormItem>
                <Button className={'button_margin'} onClick={modalCancel} type={"primary"}><Icon type="left"/>Go back</Button>
                <Button className={'button_margin'} type={"primary"}>Submit</Button>
            </FormItem>
        </Form>

    );

class App extends Component{
 constructor(props) {
        super(props);
        this.state = {
            is_authenticated: false,
            application_status_modal_visible: false,
        }
    }
handleChange =(event)=>{
        const {name,value}=event.target;
        this.setState({
            [name]: value,
        });
        console.log("handle change works");
   };
    handleSubmit=(values)=>{
    console.log(values);
    };
    modalCancel=()=>{
        this.setState({application_status_modal_visible:false})
    };
render(){
return(
<Modal
                    title="Login"
                    visible={application_status_modal_visible}
                    footer={null}
                   >
                    <Formik onSubmit={this.handleSubmit}
                            handleChange={this.handleChange}
                            render={formikProps =>
                                <InnerForm
                                    modelCancel={this.modalCancel}
                                    {...formikProps}
                                />
                            }/>
                </Modal>)
}
}

export default connect()(App)

Я ожидаю, что этот вывод {email: "abc@gmail.com", пароль: "1234567"}

...