jQueryとReact.jsがいい

Question

エラーをプレイされていません。

_registerComponent(...): Target container is not a DOM element. 

ラインインクルードが原因になっていることmain.jsxで$('#container')です。私がdocument.getElementById('container')の代わりにそれはすべてうまくいきます。私は間違って何をしていますか？ jQueryはReactで動作するように設計されていませんか？

index.jade

doctype html 
html 
    head 
     script(src="lib/babel/browser.min.js") 
     script(src="lib/react/react.min.js") 
     script(src="lib/react/react-dom.min.js") 
     script(src="lib/jquery/dist/jquery.min.js") 
    body 
     #container 

     script(src="public/js/main.jsx", type="text/babel") 

main.jsx

$(function(){ 
    var Doug = React.createClass({ 
     render: function(){ 
      return (<h1>Hello world</h1>); 
     } 
    }); 

    ReactDOM.render(
     <Doug></Doug>, 
     $('#container') 
    ); 
}); 

Answer 1

$('#container')あなたがconsole.log($('#container'));を実行し、解答を確認した場合$('#container')[0]

Answer 2

を試してみてください、jQueryオブジェクトではなく、DOM要素でありますdocument.getElementById('container');と同じようにDOMオブジェクトが返されないことがわかります。

両方をログに記録すると、jqueryオブジェクトはjquery fnのjqueryオブジェクトを実際に返します。そのDOM要素への参照を持つ配列を持つ名前空間（つまりn.fn.init[1]）。リアクションとjqueryは互いに並んで実行できるはずです。私はそれをテストしていませんが、あなたは、おそらくの線に沿って何かを試みることができる：

ReactDOM.render(<Doug></Doug>, $('#container').outerHTML()); 

をが、その時点でそれはちょうど、レンダリングのサイトをターゲットにするネイティブJSメソッドを使用するより理にかなっています。