Sencha Touch - 如何防止日期選擇器隱藏？

Question

我正在使用Ext.picker.Date，並且我在隱藏事件上運行了一些檢查。但是，如果符合某個標準，我想停止該過程並讓日期選擇器不隱藏。

我試過使用beforehide事件，並在那裏運行我的代碼，但該事件似乎並沒有觸發。

下面是我的datepicker的配置。如果條件成立，我該如何阻止選取器隱藏？

感謝您的任何幫助。

var datePicker = new Ext.picker.Date({ 
     docked: "bottom", 
     listeners: { 
      beforehide: function() { 
       console.log("before hide"); 
      }, 
      hide: function() { 
       if (1 == 1) { 
        //how do I stop the picker from hiding? 
        Ext.Msg.alert("You cannot select that date.");       
       } 

      } 
     }, 
     slotOrder: ["day", "month", "year"], 
     useTitles: false 
    }); 
    this.add(datePicker); 

Answer 1

您使用的是Sencha Touch 2嗎？因爲您使用的是Ext.picker.Date，所以我將這樣假設。

根據文檔，日期選擇器不火beforehide事件： Sencha Docs

你真的想在這裏做的是插入一些邏輯「完成」竊聽後撿拾工具隱藏自己之前。 picker在內部調用onDoneButtonTap;你可以注入自己的邏輯，像這樣：

Ext.define('MyApp.widget.DatePicker', { 
    extend: 'Ext.picker.Date', 
    xtype: 'mypicker', 

    onDoneButtonTap: function() { 
     if (1 == 1) { 
      Ext.Msg.alert("You cannot select that date."); 
     } else { 
      Ext.picker.Date.prototype.onDoneButtonTap.call(this); 
     } 
    } 
}); 

this.add({ 
    xtype  : 'mypicker', 
    docked : "bottom", 
    slotOrder : ["day", "month", "year"], 
    useTitles : false 
}); 

這是假設你的邏輯將能夠訪問它需要的日期選擇器的範圍之內。如果不是這種情況，您可以通過額外配置的日期選擇器，當您創建它...也許像acceptedDateRange {...}

最簡單的方法可能是：

var datePicker = new Ext.picker.Date({ 
    docked: "bottom", 
    slotOrder: ["day", "month", "year"], 
    useTitles: false, 
    onDoneButtonTap: function() { 
     if (1 == 1) { 
      Ext.Msg.alert("You cannot select that date."); 
     } else { 
      Ext.picker.Date.prototype.onDoneButtonTap.call(this); 
     } 
    } 
}); 

this.add(datePicker); 

我認爲像在第一個例子中那樣定義自己的類是要走的路，特別是在將邏輯注入現有框架代碼以及在多個位置使用該組件的情況下。但第二個例子也會起作用。