ReactJS + Express.js + React-Bootstrap：ブートストラップボタンのonClickハンドラが動作しません

Question

ReactJSの学習を始めたばかりなので、onClickハンドラを動作させることができません。

私はExpress.jsアプリケーションジェネレータのチュートリアルに続き、次のコードで終わりました。

誰かが間違っていることを教えてください。

//app.js file 
 

 
var express = require('express'); 
 
var path = require('path'); 
 

 
// routes 
 
var launch = require('./routes/launch'); 
 

 
var app = express(); 
 

 
// view engine setup 
 
app.set('views', __dirname + '/views'); 
 
app.set('view engine', 'jsx'); 
 
app.engine('jsx', require('express-react-views').createEngine()); 
 

 
app.use(bodyParser.json()); 
 
app.use(bodyParser.urlencoded({ extended: false })); 
 
app.use(cookieParser()); 
 
app.use(express.static(path.join(__dirname, 'public'))); 
 

 
// attach url to routes 
 
app.use('/', launch);

//launch.js 
 

 
var express = require('express'); 
 
var router = express.Router(); 
 

 

 
router.get('/', function(req, res, next) { 
 
    res.render('launch', {}); 
 
}); 
 

 
module.exports = router;

//launch.jsx code 
 

 
var React = require('react'); 
 
var DefaultLayout = require('./layouts/default'); 
 

 
// bootstrap 
 
import {Button, Grid, Row, Col, Clearfix, Image, FormGroup, InputGroup, FormControl} from 'react-bootstrap'; 
 

 
var LaunchView = React.createClass({ 
 
    render: function() { 
 
    return (
 
     <FormGroup> 
 
     <InputGroup> 
 
     <FormControl id="launch-email" type="email" placeholder="Email" /> 
 
     <InputGroup.Button> 
 
     <Button id="launch-submit" className="button-green" onClick={this.handleSubmit}>Submit</Button> 
 
     </InputGroup.Button> 
 
     </InputGroup> 
 
     </FormGroup> 
 
    ); 
 
    }, 
 
    handleSubmit: function(){ 
 
    alert("woot"); 
 
    } 
 
}); 
 

 
module.exports = LaunchView;

Answer 1

トンのイベントをアタッチサポートしていません。後でクライアント側の更新やクライアント側の更新を行うことができます。 https://github.com/reactjs/express-react-views/issues/2