在导入sencha touch/base scs时，未触发选择字段选取器的选取事件

Question

我有一个选择字段，希望手动处理选择字段选择器事件。选择字段的以下代码：

{
          xtype: 'selectfield',  
          label: 'Choose one',  
          name:'abcd',  
          usePicker:true,  
          options: [  
              {text: 'First Option',  value: 'first'},  
              {text: 'Second Option', value: 'second'},  
              {text: 'Third Option',  value: 'third'}     
    ],     
    defaultPhonePickerConfig: {  
        hideOnMaskTap: true,  
        listeners: {  
            change: function(ths, val) {
               console.log('change event called');
            },
            pick: function(ths, The, slot) {
              console.log('pick event called');
                PICKER_CONFIG = null;
                if (PICKER_CONFIG != true) {
                    if (The[slot.getName()] != undefined && The[slot.getName()] != null && The[slot.getName()] != "") {
                     //   Ext.getCmp('contractList').setValue(The[slot.getName()]);
                        ths.fireEvent('change', ths, The);
                        ths.hide();
                    }
                }
            },
            cancel: function() {
                console.log('cancel called');
                PICKER_CONFIG = true;
            },
            show:function(){
              console.log('show called');  
            }
        }
    },

没有调用pick，因为我使用的是基本css。

这是我的app.scss

@import 'sencha-touch/base';

但如果我使用sencha touch default和default/allcss，它会起作用类似：

@import 'sencha-touch/default';
@import 'sencha-touch/default/all;

但是，我不想使用它
有没有任何方法可以通过使用sencha touch/base-css来获得pick。

Answer 1

hmm。。。

你能告诉我从哪里得到"挑选"活动吗？它应该做什么？

我猜这和"改变"是一回事。

你怎么知道它，因为你使用的是基本css？根据我所读到的基本css，sencha将使用最低限度的组件样式来工作，其余的将由用户决定。因此应该不会对事件组件的行为产生影响。

Answer 2

这是我为在SelectField:中设置Picker而写的

  {
                        xtype: 'selectfield',
                        usePicker: true,
                        displayField: 'text',
                        valueField: 'value',
                        options: [
                            { text: 'Choose Dosage', value: 'default' },
                        ],
                        defaultPhonePickerConfig : {
                            listeners: {
                                change: function(thePicker, newValue, oldValue) {
                                    //check if custom variable has been set to false
                                    if (newValue.slotsNumeric != null && newValue.slotsDecimal != null) {
                                        var total = newValue.slotsNumeric + newValue.slotsDecimal;
                                        // set the select field to show the correct selected value!!
                                        var DecimalPicker = Ext.ComponentQuery.query('selectfield')[0];
                                        DecimalPicker.setOptions({
                                            text: total,
                                            value: total
                                        });
                                    }
                                },
                            },
                            useTitles: true,
                            hideOnMaskTap: true,
                            slots: [
                                {
                                    name  : 'slotsNumeric',
                                    title : 'Numeric',
                                    align: 'center',
                                    data : [
                                        {text: '0', value: 0},
                                        {text: '1', value: 1},
                                        {text: '2', value: 2},
                                        {text: '3', value: 3},
                                        {text: '4', value: 4},
                                        {text: '5', value: 5},
                                        {text: '6', value: 6},
                                        {text: '7', value: 7},
                                        {text: '8', value: 8},
                                        {text: '9', value: 9},
                                    ]
                                }, 
                                {
                                    name  : 'slotsDecimal',
                                    title : 'Decimal',
                                    align: 'center',
                                    data : [
                                        {text: '.0', value: .0},
                                        {text: '.1', value: .1},
                                        {text: '.2', value: .2},
                                        {text: '.3', value: .3},
                                        {text: '.4', value: .4},
                                        {text: '.5', value: .5},
                                        {text: '.6', value: .6},
                                        {text: '.7', value: .7},
                                        {text: '.8', value: .8},
                                        {text: '.9', value: .9},
                                    ]
                                }
                            ]
                        }                   
                    }