ダイアログは関数ではありません - 反応

Question

私はすでにこれについて多くの質問があることを知っていますが、それらのどれも私の問題に一致するようです。

私はそれがこのようになりますJQuery-UI dialog を使用して反応させ、コンポーネントを作成しています：私がクリックしたときに、これを持っ

var VehiclePlantDialog = React.createClass({ 
    handleSubmit: function(e) { 
     e.preventDefault(); 
     this.props.closeDialog(); 
    }, 
    render: function() { 
     return (
      <div> 
       <form> 
        <input ref="inputText" /> 
        <input type="submit" /> 
        <button onClick={this.props.closeDialog}>Cancel</button> 
       </form> 
      </div> 
     ); 
    } 
}); 

var VehiclePlants = React.createClass({ 

    openDialog: function (e) { 
     e.preventDefault(); 

     var myDialog = $('<div>').dialog({ 
      title: 'Dialog example', 
      width: 400, 
      close: function (e) { 
       React.unmountComponentAtNode(myDialog); 
       $(this).remove(); 
      } 
     }); 

     var closeDialog = function (e) { 
      e.preventDefault(); 
      myDialog.dialog('close'); 
     }; 
     $(document).ready(function() { 
      ReactDOM.renderComponent(<VehiclePlantDialog closeDialog={closeDialog} />, myDialog); 
     }); 
    }, 
    render: function() { 
     return (
      <div> 
        <button onClick={this.openDialog}>Open dialog</button> 
      </div> 
     ); 
    } 
}); 

、jquery

<% script('/scripts/jquery.js') -%> 
<% script('/scripts/jquery-ui.min.js') -%> 

含むための私のejsファイルにザ・ワークスが含まれるが、 ダイアログを開いてボタンを押すと、コンソールにはdialog is not a functionと表示されますが、コンソールに書き込むと表示されます。

誰かが私を助けることができますか？

注：私は使用していますBower、Gulp、React、ReactDom、jquery、jquery-ui

Answer 1

私はこの問題は、セレクタと開発者から$（ ''）を検査する

$('<div>').dialog({ 

試みだと思いますツール。

が、これははい、あなたが正しい

$("<div>My div content</div>").dialog({ 

EDIT を動作するはずであるかもしれません。しかし、コードに問題はありません。すでにうまく動作しています。

これをチェックしてくださいfiddle