关于extjs4.1:Extjs 4.1检查更改监听器

 2021-04-09 

Extjs 4.1 Check Change Listener

处理菜单检查项事件的正确方法是什么?

我有这个菜单:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
 {
      xtype: 'button',
      id: 'types_btn',
      autoWidth: true,
      text: 'Types',
      menu: {
              xtype: 'menu',
              frame: true,
              id: 'types_menue',

              items: [
                       {
                         xtype: 'menucheckitem',
                         id: 'f_type',
                         text: 'first',
                         listeners: {
                            checkchange: {
                                    fn: me.onFirstButtoncheckchange,
                                    scope: me
                                    }
                                      }
                       },
                       {
                        xtype: 'menucheckitem',
                        id: 's_type',
                    text: 'second',
                         listeners: {
                            checkchange: {
                                    fn: me.onSecondButtoncheckchange,
                                    scope: me
                                    }
                                      }
                       }

然后执行功能:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
onFirstButtoncheckchange: function(menucheckitem, checked, options) {

    var t = Ext.getCmp('f_type');
               if (t.checked)
                   goToFunction(???);
                 .
                 .
    },
 onSecondButtoncheckchange: function(menucheckitem, checked, options) {

    var t = Ext.getCmp('s_type');
               if (t.checked)
                   goToFunction(???);
                 .
                 .
    },

1-无论如何要使用一个侦听器并在其中收集所有不同的功能?

2-如代码中所示,如何将当前项目发送到goToFunction()?


只需为每个菜单检查项目设置一个处理程序:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
items: [{
    xtype: 'menucheckitem',
    text: 'select all' ,
    id: 'first' ,
    listeners: {
        checkchange: me.myHandler
    }
},{
    xtype: 'menucheckitem',
    text: 'select specific' ,
    id: 'second' ,
    listeners: {
        checkchange: me.myHandler
    }
}]

您的处理程序定义如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
myHandler: function (menucheckitem, checked, opts) {
    switch (menucheckitem.getId ()) {
        // Here handles the first
        case 'first':
            if (checked) {
                console.log ('First checked!');
                goToFunction ();
            }
            break;
        // Here handles the second
        case 'second':
            if (checked) {
                console.log ('Second checked!');
                goToFunction ();
            }
            break;
        default:
            console.log ('Whatever!');
    }
}

看起来监听器很少被触发。您可以改用checkHandler配置。