javascript - Add external JS to react component -

i want add canvas react component. have achieved:

var react = require('react'),     c = require('./../canvas_animation');  var home = react.createclass({   componentdidmount: function () {     react.finddomnode(this).childnodes[1].appendchild(c);   },  

this link contains canvas animation.

problem: working fine in react apart mouse events? how can make them work?

jquery(document).ready(function()             {                 $(document).mousedown(function(e)                 {                     onmousedown();                 });                  $(document).mouseup(function(e)                 {                     onmouseup();                 });              }) 

replicated here react having issue events.

react.js using syntethic event system http://facebook.github.io/react/docs/events.html. first step attach events on react node directly:

render: function() {     return <div onmousedown={onmousedown} onmouseup={onmouseup}></div>; } 

then use mouse position event args directly:

  function onmousedown(e)   {     mousex = e.pagex;     mousey = e.pagey;     ...   } 

i replaced hello world empty div because impacts size of stageheight variable , managed move balls on drag sometimes, should find out remaining parts should updated. here updated fiddle:

https://jsfiddle.net/69z2wepo/12491/