React Form onSubmit не работает.Метод передан через API контекста - PullRequest
0 голосов
/ 26 февраля 2019

Метод, переданный через Context Api, отлично работает внутри метода onClick кнопки (внутри той же формы), но не работает внутри метода onSubmit формы.

Gdpr.js

render() {

    return (
        <MyContext.Consumer>
            {(context) => (
                <div>
                    <form onSubmit={context.onSubmitGdpr}>

                        <FormattedMessage id='app.terms'/>
                        <div>
                            <label className="container"><strong><FormattedMessage id={"app.terms.agree"}/></strong>
                                <input type="checkbox" checked={this.state.agree} onChange={this.onChangeHandler}/>
                            </label>
                            <Link to={context.state.nextStageAfterGDPR ? context.state.nextStageAfterGDPR : "#"}>
                                <button disabled={!this.state.agree}><FormattedMessage id='app.buttons.submit'/>
                                </button>
                            </Link>
                        </div>
                    </form>
                </div>
            )
            }
        </MyContext.Consumer>
    )
}

export default Gdpr

MyProvider.js

Метод, переданный через провайдер Context API, ...

onSubmitGdpr = (e) => {                                                        

    e.preventDefault()                                                         
    fetch("/api/v1/gdpr")                                                      
        .then(res=> res.json())                                                
        .then(data => { this.setState({nextStageAfterGDPR: "./camera-intro"})                                                      
        })                                                                     
        .catch(error=>console.log(error))                           
}

MyProvider.js продолжается...

render() {                                                                          
    return (                                    
        <MyContext.Provider value={{            
            state: this.state,                  
            onSubmitStart: this.onSubmitStart,  
            onSubmitGdpr: this.onSubmitGdpr     
        }}>                                     
            {this.props.children}               
        </MyContext.Provider>                   
    )                                           

}                                                                            
...