0
我正試圖在Reactjs中實現jQuery UI datepicker。一切似乎都很好,我可以從datepicker中選擇日期。問題是我正在運行上的函數onChange事件的輸入,該函數沒有觸發。在Reactjs中實現jquery UI Datepicker
<!DOCTYPE html>
<html>
<head>
\t <link rel="stylesheet" href="main.css" />
\t <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
</head>
<body>
<div id="example" ></div>
\t <script src="https://unpkg.com/[email protected]/dist/react.min.js"></script>
\t <script src="https://unpkg.com/[email protected]/dist/react-dom.min.js"></script>
\t <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.24.0/babel.min.js" ></script>
\t <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
\t <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
\t <script type="text/babel">
\t \t var DatePicker = React.createClass({
\t \t _destroyDatePicker: function(){
\t \t var element = this.refs.input;
\t \t $(element).datepicker('destroy');
\t \t },
\t \t _initDatePicker: function(){
\t \t var element = this.refs.input;
\t \t $(element).datepicker(this.props);
\t \t },
\t \t componentDidMount: function(){
\t \t this._initDatePicker();
\t \t },
\t componentWillUnmount: function(){
\t \t this._destroyDatePicker();
\t \t },
\t \t render: function() {
\t \t return <input ref="input" type="text" onChange={(evt)=>console.log('new date', evt.target.value)} {...this.props}/>
\t \t }
\t \t });
\t \t ReactDOM.render(<DatePicker defaultValue="05/30/2017" />, document.getElementById('example'));
\t
\t </script>
</body>
</html>
反應,jQuery的是不是真的應該被網狀化在一起,因爲React構造了合成事件的虛擬DOM表示。您是否考慮過任何現有的React組件庫進行日期選取?一個簡單的谷歌搜索「反應日期選擇器」應該會得到許多不同的結果。 – glhrmv