2017-01-11 14 views
0

反応ルータの問題に直面しています。子ルータにdatepicker(semantic-ui-calender)のコンポーネントフォームがあり、semantic-uiのデフォルトのドロップダウンがあります。反応ルータの子プロセスでDatepickerが動作しない(リフレッシュするまで)

問題:子ルートに入力すると、これらのスタイルは機能しません。ドロップダウンのデフォルトの選択オプションのみが表示され、datepickerは単なる入力になりました。私はページをリフレッシュする場合、それらは動作しています。ここ

ドロップダウンここ

<div className="exam_class_section"> 
       <select className="ui dropdown"> 
       <option value>Section</option> 
       <option value="A">A</option> 
       <option value="B">B</option> 
       </select> 
</div> 

ルータセクションここ

<Route path="/examination" component={Examination}> 
     <IndexRoute component={Add_new_schedule}/> 
     <Route path="/examination/AddNewSchedule" component={Add_new_schedule} /> 
     <Route path="/examination/AddExam" component={Add_exam} /> 
</Route> 

さであり、時間から

までの時間日付ピッカー(セマンティックUI-カレンダー)日付と、
<div className="exam_date_time_box"> 
      <div id="exam_date" className="ui calendar"> 
       <div className="ui left icon input"> 
       <input 
        type="text" 
        placeholder="Examination Date" /> 
       <i className="calendar icon" /> 
       </div> 
      </div> 
      <div className="exam_time_box"> 
       <div id="time_from" className="ui calendar"> 
       <div className="ui input left icon"> 
        <i className="time icon" /> 
        <input type="text" placeholder="Time From" /> 
       </div> 
       </div> 
       <div id="time_to" className="ui calendar"> 
       <div className="ui input left icon"> 
        <i className="time icon" /> 
        <input type="text" placeholder="Time To" /> 
       </div> 
       </div> 
      </div> 
      </div> 

ありがとう

答えて

0

私はこの問題を解決しました。

外部のjsファイルが反応ルータに読み込まれないことが原因です。

解決策は、それが

import loadjs from 'loadjs'を必要とcomponentWillMound(内部呼び出しされる特定のコンポーネントページにインポートしloadjsライブラリとJS外部ファイルをロードである)ライフサイクル方法

componentWillMount() { 
loadjs('/js/main.js'); 
}, 
関連する問題