javascript - 表单上的 ReactJS onSubmit 不起作用

Question

我有一个神秘的问题:当我点击按钮或按下回车键时，没有任何反应。

Row = ReactBootstrap.Row
Col = ReactBootstrap.Col
Input = ReactBootstrap.Input
Button = ReactBootstrap.Button

@NewSession = React.createClass
  handleSubmit: (e) ->
    alert 'f'
    e.preventDefault()
    Dispatcher.query('sessions', {}, 'POST')
  render: ->
    <form onSubmit={@handleSubmit} noValidate>
      <Row>
        <Col md={6} mdOffset={3} className='text-center'>
          <Input type='text' placeholder='Your username' ref='login' />
          <Input type='text' placeholder='Your password' ref='password' />
          <Button bsStyle='success'>Sign in</Button>
        </Col>
      </Row>
    </form>

这种奇怪行为的原因是什么？为什么 handleSubmit 不起作用？

已更新

如果我将 onClick={@handleSubmit} 处理程序放在按钮上，点击是有效的

Answer 1

react-bootstrap Button 组件 default to type="button" , 所以你需要添加 type="submit" 来创建一个提交按钮。

<Button type='submit' bsStyle='success'>Sign in</Button>