reactjs - 反应表单 onSubmit 不起作用。通过 Context API 传递的方法

Question

通过 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>                   
    )                                           

}                                                                            

标签： reactjsformsreact-context