1

经过 2 天的搜索和尝试各种代码片段和解释后，我需要在这里寻求帮助！

演示： http: //kachipun.se/sandbox/touch/

问题： 在应用程序的登录页面上，我有 8 个相同图像的实例（计划稍后将它们装扮成按钮）。我想将这些单独的图像链接到我在左侧菜单中列出的 8 个不同视图。

据我了解，我需要使用 setActiveItem()，但是我尝试无法让它工作；/

资源： 对于这个特定的项目，我使用了 wozznik 的 Slider Menu 作为菜单的基础，并以此为基础。

它包含一个存储不同视图的数据。

Ext.define('SliderMenu.store.MenuOptions', {    extend: 'Ext.data.Store',

    requires: [,
    ],

    config: {
        model: 'SliderMenu.model.MenuOption',
        storeId: 'MenuOptionsStore',

        //Customize your menu options
        data: [
            {id: 1, view: 'SliderMenuDemo.view.Start', iconCls: 'basic', iconMask:true, text:'Start'},
            {id: 2, view: 'SliderMenuDemo.view.MC', iconCls: 'basic', iconMask:true, text:'Machining Center'},
            {id: 3, view: 'SliderMenuDemo.view.TC', iconCls: 'basic', iconMask:true, text:'Turning Center'},
            {id: 4, view: 'SliderMenuDemo.view.ST', iconCls: 'basic', iconMask:true, text:'Silent Tools'},
            {id: 5, view: 'SliderMenuDemo.view.HC', iconCls: 'basic', iconMask:true, text:'Heavy Cuts'},
            {id: 6, view: 'SliderMenuDemo.view.MT', iconCls: 'basic', iconMask:true, text:'Multi Task'},
            {id: 7, view: 'SliderMenuDemo.view.SH', iconCls: 'basic', iconMask:true, text:'Sliding Head'},
            {id: 8, view: 'SliderMenuDemo.view.VTL', iconCls: 'basic', iconMask:true, text:'VTL'},
            {id: 9, view: 'SliderMenuDemo.view.Web', iconCls: 'basic', iconMask:true, text:'Web'},
        ]
    }
});

在登陆视图（Start.js）上，我有这样的图像设置，侦听器监听不同图像的点击（检查控制台日志）：

items: [{            
                   html: '<div class="gridwrapper">'+
                  '<img class="test1 normal" src="http://static.flickr.com/43/102997171_f9263d8797_o.jpg" width="23%" />'+
                  '<img class="test2 normal" src="http://static.flickr.com/43/102997171_f9263d8797_o.jpg" width="23%" />'+
                  '<img class="test3 normal" src="http://static.flickr.com/43/102997171_f9263d8797_o.jpg" width="23%" />'+
                  '<img class="test4 normal" src="http://static.flickr.com/43/102997171_f9263d8797_o.jpg" width="23%" />'+
                  '<img class="test5 normal" src="http://static.flickr.com/43/102997171_f9263d8797_o.jpg" width="23%" />'+
                  '<img class="test6 normal" src="http://static.flickr.com/43/102997171_f9263d8797_o.jpg" width="23%" />'+
                  '<img class="test7 normal" src="http://static.flickr.com/43/102997171_f9263d8797_o.jpg" width="23%" />'+
                  '<img class="test8 normal" src="http://static.flickr.com/43/102997171_f9263d8797_o.jpg" width="23%" />'+
                  '</div>',

                },
                {
              }],


        listeners: [{        
            element: 'element',          
            delegate: 'img.test1',          
            event: 'tap',          
            fn: function() {
                console.log('One!');
              }      
        },{            
            element: 'element',          
            delegate: 'img.test2',          
            event: 'tap',          
            fn: function() {
               console.log('Two!');
              }
        }

我真的希望你们能帮助我理解这一点！

此致

4

1 回答 1

0 
Please try:
listeners: [{        
            element: 'element',          
            delegate: 'img.test1',          
            event: 'tap',          
            fn: function() {
                Ext.getCmp("maincard").changeViewTo(Ext.create("SliderMenuDemo.view.SH"));
                // alternative: Ext.getCmp("SliderMenu.view.Main").changeViewTo(Ext.create("SliderMenuDemo.view.SH"));
              }      
        }
于 2012-05-23T17:11:52.113 回答