2017-10-02 4 views
0

私はvue js appに取り組んでいます.2つのルーティングページAとBがあります。どちらも、日付ピッカーの3セットの設定オプションを含んでいます。 ページAの日付ピッカーが動作していて、ページBに行くと動作しません。たとえ私がページAに戻っても、それは動作しません。 ページを更新した後でのみ動作します。日付ピッカーは別のルーティングページで動作しないか、またはvue jsに戻ったときに機能しませんか?

enter image description here

$(function() { 
 

 
/// col 1 DateTimePicker 
 
     $('#col1vis').datetimepicker({ 
 
      format: 'YYYY-MM-DD' 
 
     }); 
 
     $('#col1bis').datetimepicker({ 
 
      format: 'YYYY-MM-DD', 
 
      useCurrent: false //Important! See issue #1075 
 
     }); 
 
     $("#col1vis").on("dp.change", function (e) { 
 
      $('#col1bis').data("DateTimePicker").minDate(e.date); 
 
     }); 
 
     $("#col1bis").on("dp.change", function (e) { 
 
      $('#col1vis').data("DateTimePicker").maxDate(e.date); 
 
     }); 
 
     /// col 2 DateTimePicker 
 

 
     /// col 2 DateTimePicker 
 
       $('#col2vis').datetimepicker({ 
 
        format: 'YYYY-MM-DD' 
 
       }); 
 
       $('#col2bis').datetimepicker({ 
 
       format: 'YYYY-MM-DD', 
 
        useCurrent: false //Important! See issue #1075 
 
       }); 
 
       $("#col2vis").on("dp.change", function (e) { 
 
        $('#col2bis').data("DateTimePicker").minDate(e.date); 
 
       }); 
 
       $("#col2bis").on("dp.change", function (e) { 
 
        $('#col2vis').data("DateTimePicker").maxDate(e.date); 
 
       }); 
 

 
     /// col 2 DateTimePicker 
 
       $('#col3vis').datetimepicker({ 
 
        format: 'YYYY-MM-DD' 
 
       }); 
 
       $('#col3bis').datetimepicker({ 
 
       format: 'YYYY-MM-DD', 
 
        useCurrent: false //Important! See issue #1075 
 
       }); 
 
       $("#col3vis").on("dp.change", function (e) { 
 
        $('#col3bis').data("DateTimePicker").minDate(e.date); 
 
       }); 
 
       $("#col3bis").on("dp.change", function (e) { 
 
        $('#col3vis').data("DateTimePicker").maxDate(e.date); 
 
       }); 
 
    });

+0

?各ページの変更が読み込まれますか?それはキャッシュされていますか?それは一度ロードされますか? (私はそれが一度だけロードされていると仮定します) –

答えて

1

あなたはVueのは、変更を認識できなくなりますので、Vuejsが管理する要素に変更を加えることはありませんしなければならないと右先に行くと、それを上書きしようとしています次の更新サイクル。

日付ピッカーを新しいコンポーネントにラップすることができます。それ以上は、Vueで考えてみてjQueryを離れてみてください。

あなたは安全にこのリンクでVuejsでのjQueryを使用する方法を読むことができます:https://vuejsdevelopers.com/2017/05/20/vue-js-safely-jquery-plugin/このスクリプトが配置されている

関連する問題