Question

我在按钮工具栏中加载了多个按钮我需要这些按钮才能转到不同的链接。但是，我无法弄明白。以下是我尝试做的但是不起作用。

        //Below are three buttons that need to go to three different links 
    var buttonsGroup1 = new Ext.Button({
    text: 'MESSAGES',
    handler: tapHandler
    });

    var buttonsGroup2 = new Ext.Button({
    text: 'HOLDS',
    handler: tap2Handler
    });

    var buttonsGroup3 = new Ext.Button({
    text: 'FINANCIALS',
    handler: tapHandler
    });

    //Click on the button and it goes to these links 
    var tapHandler = function (btn, evt) {
        window.location = 'index.html';
    };

    var tap2Handler = function (btn, evt) {
        window.location = 'redirect.php';
    };

    //Combine all the variables above and some other stuff and then add it to docked items very object oriented =)
    var dockedItems = [
    {
        xtype: 'toolbar',
        title: 'Student Portal',
        ui: 'light',
        dock: 'top',
        items: buttonsSpecTop,
        defaults: { handler: tapHandler }
    },  
    {
        xtype: 'toolbar',
        ui: 'dark',
        items: [buttonsGroup1, buttonsGroup2, buttonsGroup3], //This is where I load up all the buttons 
        dock: 'bottom',
        layout:{
        pack: 'center'
        },
        defaults: [handler: tapHandler, handler: tap2Handler] //This is the handler for the links

    }];

Answer 1

对于每个按钮配置，添加一个额外的配置参数，例如actionUrl：

{
    xtype: 'toolbar',
    actionUrl : 'http://www.google.com',
    title: 'Student Portal',
    ui: 'light',
    dock: 'top',
    items: buttonsSpecTop,
    defaults: { handler: tapHandler }
}

现在，对于tapHandler函数，第一个参数是按钮实例。所以，你可以这样得到网址：

function tapHandler(btn){
   console.log(btn);
   window.open(btn.actionUrl);
}

你不能在数组中以这种方式放入javascript：

defaults: [handler: tapHandler, handler: tap2Handler]

你必须使用一个对象，类似于第一个：

defaults: { handler: tapHandler }

并且，您不能在同一个对象中放置多个同名参数，只有一个“处理程序”会在那里。对于默认值，只有一个处理程序将应用于所有项目。因此，如果您需要单个按钮的单独处理程序，请对每个按钮使用处理程序侦听器。

如何在Sencha touch中链接工具栏中的按钮？

1 个答案: