获取一个event.preventDefault（）;不是一个功能。为什么它不是一个功能？

Question

我与反应工作，并以下教程表单提交了一把，我碰上我的控制台这个问题：

contact.js:67 Uncaught TypeError: event.preventDefault is not a function(…) 

这里是我的代码：

contact.js

class ContactForm extends Component { 


    constructor(props) { 
    super(props); 
    this.handleSubmit = this.handleSubmit.bind(this); 
    this.state = { open: false }; 
    } 

    handleSubmit(event) { 
    console.log('hello'); 
    event.preventDefault(); 
    } 

    handleTouchTap =() => { 
    this.setState({ open: true }); 
    } 

    handleRequestClose =() => { 
    this.setState({ open: false }); 
    } 

    render() { 
    return(
     <div> 
     <Paper className="Form" zDepth={2}> 
      <Formsy.Form onSubmit={this.handleSubmit}> 
      <FormsyText 
       name="Enter Name" 
       floatingLabelText="Enter your name" 
      /> 
      <FormsyText 
       name="Enter email address" 
       floatingLabelText="Enter your email address" 
      /> 
      <FormsyText 
       name="message" 
       floatingLabelText="What can I do for you?" 
      /> 
      <RaisedButton onTouchTap={this.handleTouchTap} 
       type="submit" 
       label="Submit your message" 
       primary={true} 
      /> 
      <Snackbar 
       open={this.state.open} 
       message="Thank your for submitting your message. I'll get back to you as soon as I can!" 
       autoHideDuration={2000} 
       onRequestClose={this.handleRequestClose} 
      /> 
      </Formsy.Form> 
     </Paper> 
     </div> 
    ); 
    } 
} 

export { ContactForm }; 

正如你可以看到我的代码和我所知道的，我已经正确地将handleSubmit绑定到我的ContactForm，并且应该在onSubmit处理程序上正确调用它this.handleSubmit。我在这里可能会错过什么？

Answer 1

你不使用默认的形式...

这是Formsy

从文档

https://github.com/christianalfoni/formsy-react/blob/master/API.md#onsubmit

的onsubmit（数据，resetForm，invalidateForm）

在提交按钮时需要运行 函数已被点击。

第一个参数是表单的数据。第二个参数将重置表格 。第三个参数将通过将 映射到输入的对象使表单无效。这对于服务器端 验证非常有用。例如。 {email：“收到此邮件”}。重置或 使表单失效将导致setState在表单元素 组件上运行。

Answer 2

Formsy将表单数据作为第一个参数传递给提交事件处理程序。 此表格数据没有功能preventDefault()。

如果你指的是内部实现提交机制，你会看到preventDefault()总是默认名称为：

submit: function (event) { 

    event && event.preventDefault(); 

    // Trigger form as not pristine. 
    // If any inputs have not been touched yet this will make them dirty 
    // so validation becomes visible (if based on isPristine) 
    this.setFormPristine(false); 
    var model = this.getModel(); 
    this.props.onSubmit(model, this.resetModel, this.updateInputsWithError); 
    this.state.isValid ? this.props.onValidSubmit(model, this.resetModel, this.updateInputsWithError) : this.props.onInvalidSubmit(model, this.resetModel, this.updateInputsWithError); 

}, 

Source