React.js onclick-Handler funktioniert nicht

Question

Ich verwende react.js als Templating-Bibliothek in meiner node.js-Anwendung. Ich verwende jsx-Syntax für meine reagierenden Komponenten. Ich habe eine Route wie/entities, die die entities.jsx-Datei rendert (es ist eine Ansicht). Ich habe den folgenden Code in meiner Datei entities.jsx. Ich versuche, den onclickhandler in meinem Code aufzurufen und es funktioniert nicht. Ich rende es nicht explizit mit React.render, aber die Komponente wird im Browser angezeigt, wenn ich localhost:/entities treffe, aber der onclick-Handler nicht feuert.

var MyComponent = React.createClass({ 
    alertMessage: function() { 
     alert(this.props.name);        
    }, 
    render: function() { 
     return (
     <div onClick={this.alertMessage}> 
     Hello {this.props.name} 
     </div> 
    ); 
    } 
}); 

Die Beispiele, die ich online ein jsx Skript in einer HTML und eine Komponente innerhalb eines HTML-Div-Tag, aber ich versuche react.js in meiner node.js Anwendung zu verwenden gemacht eingebettet gesehen haben machen. Ich möchte es nicht innerhalb eines HTML-Tags rendern, aber die Komponente sollte basierend auf einer URL rendern und sollte dynamisch sein.

Ich habe den folgenden Code-Schnipsel in meiner index.js-Datei in meiner Knoten-Anwendung. Ich habe die 'Entitäten' der Ansicht über meine index.js-Datei getroffen, die die View-Entitäten rendert.

app.get('/entities', function(req, res) { 
    res.render('entities', { 
    title: 'Entities - Turkey Disclosure', 
    name: 'Entities', 
    selection: 'header-entities' 
    }); 
}); 

Answer 1

Wenn ich Sie richtig Sie React.renderToString() verwenden in Knoten-Anwendung zu machen reagieren. React fügt onClick und andere Ereignisanweisungen nicht direkt in Markup ein. Wenn Sie diese Ereignisse beibehalten möchten, sollten Sie React.render() auf einem Knoten aufrufen, der bereits Server-gerenderten Markup hat. React behält es bei und verknüpft nur Event-Handler, so dass Sie eine sehr performante First-Load-Erfahrung haben.

There's a nice article erklärt den Unterschied zwischen drei Rendermethoden in React.