如何通過framework7中的picker通過v-model獲取數據？

Question

我已經創建了文本輸入字段類似下面，

<f7-list-item> 
      <f7-icon slot="media" f7="time"></f7-icon> 
      <f7-input type="text" placeholder="Delivery time" v-model="order.time" readonly id="picker-describe"></f7-input> 
</f7-list-item> 

Now in mounted method, I have the below code, 
mounted: function mounted() { 
      //do something after mounting vue instance 
     var myApp = new Framework7(); 
     var pickerDescribe = myApp.picker({ 
      input: '#picker-describe', 
      rotateEffect: true, 
      cols: [ 
      // Hours 
      { 
       values: (function() { 
        var arr = []; 
        for (var i = 0; i <= 23; i++) { arr.push(i); } 
        return arr; 
       })(), 
      }, 
      // Divider 
      { 
       divider: true, 
       content: ':' 
      }, 
      // Minutes 
      { 
       values: (function() { 
        var arr = []; 
        for (var i = 0; i <= 59; i++) { arr.push(i < 10 ? ': 0' + i : ": " + i); } 
        return arr; 
       })(), 
      }, 
      // Meridian 
      { 
       values: (function() 
       { 
        var arr = ['am','pm']; 
        return arr; 
       })(), 
      } 
      ] 
     }); 
    }, 

當我嘗試選擇的時候，我能愉快地選擇時間像下面，

現在的我m試圖通過模型獲取價值，我在order.time領域變得空洞。

誰能幫助我如何通過模型得到的時間字段的數據？

感謝&問候，

Answer 1

我只是通過這樣做V系列：點擊=的onChange上拾取場，

<f7-list-item> 
      <f7-icon slot="media" f7="time"></f7-icon> 
      <f7-input type="text" class="delivery-time" v-on:change='changeTime()' placeholder="Delivery time" v-model="order.deliveryTime" readonly id="picker-describe"></f7-input> 
</f7-list-item> 

這是我如何解決這個難題的代碼，

我做了24小時的時間格式，我再次添加'：0'到日期。

changeTime() { 
       var $$ = Dom7; 
       var date = $$('#picker-describe').val(); 
       this.order.deliveryTime = date + ':0'; 
      }, 

現在我有時間數據，

order: { 
    "deliveryTime":'' 
} 

我能夠通過訪問希望得到實時數據this.order.deliveryTime時，它得到了改變。這只是一種替代方案，這種情況下一定有其他的東西。

謝謝，