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); 

我认为像在第一个例子中那样定义自己的类是要走的路，特别是在将逻辑注入现有框架代码以及在多个位置使用该组件的情况下。但第二个例子也会起作用。